Skip to content

Commit ba969ee

Browse files
acunniffeacunniffe
authored
Feature diff static file out (#2863)
1 parent 646db75 commit ba969ee

File tree

14 files changed

+112
-32
lines changed

14 files changed

+112
-32
lines changed

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "openapi-workspaces",
33
"license": "MIT",
44
"private": true,
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"workspaces": [
77
"projects/json-pointer-helpers",
88
"projects/openapi-io",

‎projects/fastify-capture/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/fastify-capture",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/json-pointer-helpers/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/json-pointer-helpers",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/openapi-io/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/openapi-io",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/openapi-utilities/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/openapi-utilities",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/optic/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/optic",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/optic/src/commands/diff/diff.ts

+28-4
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ type DiffActionOptions = {
4646
severity: 'info' | 'warn' | 'error';
4747
lastChange: boolean;
4848
generated?: boolean;
49+
out?: string;
4950
};
5051

5152
const description = 'Run a diff between two API specs';
@@ -118,6 +119,10 @@ export const registerDiff = (
118119
.option('-c, --check', 'Enable checks', false)
119120
.option('-u, --upload', 'Upload run to cloud', false)
120121
.option('-w, --web', 'View the diff in the Optic changelog web view', false)
122+
.option(
123+
'-o, --out <file>',
124+
'write a self-contained HTML diff. use with --web'
125+
)
121126
.option('--json', 'Output as json', false)
122127
.option('--last-change', 'Find the last change for this spec', false)
123128
.option(
@@ -368,6 +373,8 @@ const getDiffAction =
368373

369374
const diffResult = await runDiff(parsedFiles, config, options, file1);
370375
let maybeChangelogUrl: string | null = null;
376+
let indexPath: string | null = null;
377+
let compressedData: string | null = null;
371378
let specUrl: string | null = null;
372379

373380
let [baseParseResult, headParseResult, specDetails] = parsedFiles;
@@ -447,15 +454,14 @@ const getDiffAction =
447454
base: options.base,
448455
};
449456

450-
const compressedData = compressDataV2(
457+
compressedData = compressDataV2(
451458
baseParseResult,
452459
headParseResult,
453460
diffResult.specResults,
454461
meta,
455462
diffResult.changelogData
456463
);
457464
analyticsData.compressedDataLength = compressedData.length;
458-
logger.info('Opening up diff in web view');
459465

460466
const copyPath = path.join(os.tmpdir(), 'optic-changelog');
461467

@@ -466,13 +472,31 @@ const getDiffAction =
466472
{ errorOnExist: false, overwrite: false }
467473
);
468474

469-
const baseHtml = path.resolve(path.join(copyPath, 'index.html'));
475+
indexPath = path.join(
476+
path.resolve(path.join(__dirname, '../../../web/build')),
477+
'index.html'
478+
);
479+
const baseHtml = path.resolve(indexPath);
470480

471481
maybeChangelogUrl = `${baseHtml}#${compressedData}`;
472482
await flushEvents();
473483
}
474484
trackEvent('optic.diff.view_web', analyticsData);
475-
await openUrl(maybeChangelogUrl);
485+
if (options.out && indexPath) {
486+
const indexContents = (await fs.readFile(indexPath)).toString();
487+
const newContents = indexContents.replace(
488+
`<div id="root"></div>`,
489+
`<div id="root"></div><script>window.diffData ='${compressedData}'</script>`
490+
);
491+
492+
const out = path.resolve(process.cwd(), options.out);
493+
logger.info('Diff HTML written to ' + out);
494+
495+
await fs.writeFile(out, newContents);
496+
} else {
497+
logger.info('Opening up diff in web view');
498+
await openUrl(maybeChangelogUrl);
499+
}
476500
}
477501
}
478502

‎projects/optic/web/craco.config.js

+33-4
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
const webpack = require('webpack');
2+
const HtmlWebpackPlugin = require('html-webpack-plugin');
3+
const HtmlInlineScriptPlugin = require('html-inline-script-webpack-plugin');
24

35
module.exports = {
46
webpack: {
57
alias: {
68
fs: false,
79
path: false,
8-
// Alias fallbacks for node files with `node:` prefix removed
9-
// In the future, we should split out our dependencies into node + browser
1010
'fs/promises': false,
1111
zlib: false,
1212
os: false,
@@ -24,12 +24,41 @@ module.exports = {
2424
},
2525
plugins: {
2626
add: [
27-
// https://github.com/webpack/webpack/issues/13290#issuecomment-1188760779
28-
// in combination with the fallbacks above
27+
// Replace node prefix
2928
new webpack.NormalModuleReplacementPlugin(/^node:/, (resource) => {
3029
resource.request = resource.request.replace(/^node:/, '');
3130
}),
31+
// HtmlWebpackPlugin to generate HTML output
32+
new HtmlWebpackPlugin({
33+
inject: 'body', // Inject scripts at the end of the body
34+
template: './public/index.html',
35+
filename: 'index.html', // Ensure a single output HTML file
36+
}),
37+
// Inline JavaScript into the HTML
38+
new HtmlInlineScriptPlugin(),
3239
],
3340
},
41+
configure: (webpackConfig) => {
42+
// Remove any existing HtmlWebpackPlugin instances to prevent conflicts
43+
webpackConfig.plugins = webpackConfig.plugins.filter(
44+
(plugin) =>
45+
!(
46+
plugin.constructor &&
47+
plugin.constructor.name === 'HtmlWebpackPlugin'
48+
)
49+
);
50+
51+
// Add HtmlWebpackPlugin after removing any existing instances
52+
webpackConfig.plugins.push(
53+
new HtmlWebpackPlugin({
54+
inject: 'body',
55+
template: './public/index.html',
56+
filename: 'index.html',
57+
}),
58+
new HtmlInlineScriptPlugin()
59+
);
60+
61+
return webpackConfig;
62+
},
3463
},
3564
};

‎projects/optic/web/package-lock.json

+39
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎projects/optic/web/package.json

+2
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
"@testing-library/jest-dom": "^5.17.0",
1515
"@testing-library/react": "^13.4.0",
1616
"@testing-library/user-event": "^13.5.0",
17+
"html-webpack-inline-source-plugin": "^0.0.10",
18+
"html-inline-script-webpack-plugin": "^3.2.1",
1719
"@types/jest": "^27.5.2",
1820
"@types/node": "^16.18.104",
1921
"@types/react": "^18.3.3",

‎projects/optic/web/public/index.html

-15
Original file line numberDiff line numberDiff line change
@@ -2,28 +2,13 @@
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
5-
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
65
<meta name="viewport" content="width=device-width, initial-scale=1" />
76
<meta name="theme-color" content="#000000" />
87
<meta
98
name="description"
109
content="Web site created using create-react-app"
1110
/>
12-
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
13-
<!--
14-
manifest.json provides metadata used when your web app is installed on a
15-
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
16-
-->
17-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18-
<!--
19-
Notice the use of %PUBLIC_URL% in the tags above.
20-
It will be replaced with the URL of the `public` folder during the build.
21-
Only files inside the `public` folder can be referenced from the HTML.
2211

23-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24-
work correctly both with client-side routing and a non-root public URL.
25-
Learn how to configure a non-root public URL by running `npm run build`.
26-
-->
2712
<title>Optic Changelog</title>
2813
</head>
2914
<body>

‎projects/optic/web/src/index.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@ const decodeHash = (data: string): any => {
1616

1717
const App = () => {
1818
const transformed = useMemo(() => {
19-
const decoded = decodeHash(window.location.hash);
19+
// @ts-ignore
20+
const decoded = decodeHash(window.diffData || window.location.hash);
2021
return {
2122
...decoded,
2223
base: {

‎projects/rulesets-base/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/rulesets-base",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

‎projects/standard-rulesets/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"name": "@useoptic/standard-rulesets",
33
"license": "MIT",
44
"packageManager": "yarn@4.1.1",
5-
"version": "1.0.3",
5+
"version": "1.0.4",
66
"main": "build/index.js",
77
"types": "build/index.d.ts",
88
"files": [

0 commit comments

Comments
 (0)