diff --git a/packages/dev/package.json b/packages/dev/package.json
index acdff31c..8ab3c12e 100644
--- a/packages/dev/package.json
+++ b/packages/dev/package.json
@@ -44,7 +44,7 @@
"tsconfig-paths-webpack-plugin": "^3.3.0",
"webpack": "^5.95.0",
"webpack-cli": "^5.1.1",
- "webpack-dev-server": "^5.2.1",
+ "webpack-dev-server": "^5.2.2",
"yaml": "^1.10.2",
"yaml-loader": "^0.6.0"
}
diff --git a/packages/vscode/package.json b/packages/vscode/package.json
index 31bcffec..afe9c448 100644
--- a/packages/vscode/package.json
+++ b/packages/vscode/package.json
@@ -56,16 +56,16 @@
"ts-loader": "^9.4.2",
"tslint": "^6.1.3",
"vscode": "^1.1.37",
- "webpack": "^5.83.0",
+ "webpack": "^5.94.0",
"webpack-cli": "^5.1.1"
},
"dependencies": {
- "@cloudmosaic/quickstarts": "^0.0.15",
"@patternfly/patternfly": "^6.3.1",
+ "@patternfly/quickstarts": "^6.0.0-prerelease.0",
"i18next-parser": "^9.3.0",
- "js-base64": "^3.6.0",
+ "js-base64": "3.7.8",
"js-yaml": "^4.0.0",
- "react": "^18.2.0",
- "react-dom": "^18.2.0"
+ "react": "18.3.1",
+ "react-dom": "18.3.1"
}
}
diff --git a/packages/vscode/src/extension.ts b/packages/vscode/src/extension.ts
index 72371e6c..85262162 100644
--- a/packages/vscode/src/extension.ts
+++ b/packages/vscode/src/extension.ts
@@ -19,9 +19,14 @@ export function activate(context: vscode.ExtensionContext) {
const disposable = vscode.commands.registerCommand(
"extension.qsPreview",
() => {
+ const activeEditor = vscode.window.activeTextEditor;
+ if (!activeEditor) {
+ vscode.window.showWarningMessage("Please open a file first to preview quick starts.");
+ return;
+ }
view = new ViewLoader(
- vscode.window.activeTextEditor?.document.getText() as string,
- vscode.window.activeTextEditor?.document.fileName as string,
+ activeEditor.document.getText(),
+ activeEditor.document.fileName,
context.extensionPath
);
}
diff --git a/packages/vscode/src/view/ViewLoader.ts b/packages/vscode/src/view/ViewLoader.ts
index 2ad52c25..7aa4faf7 100644
--- a/packages/vscode/src/view/ViewLoader.ts
+++ b/packages/vscode/src/view/ViewLoader.ts
@@ -52,11 +52,18 @@ export default class ViewLoader {
}
private getWebviewContent(config: string, filePath: string): string {
+ if (!this._panel) {
+ return "";
+ }
// Local path to main script run in the webview
const reactAppPathOnDisk = vscode.Uri.file(
path.join(this._extensionPath, "quickstartsPreview", "quickstartsPreview.js")
);
+ // Use vscode-resource scheme for older VS Code API compatibility
const reactAppUri = reactAppPathOnDisk.with({ scheme: "vscode-resource" });
+ // Escape the config and filePath for HTML to prevent XSS and syntax errors
+ const escapedConfig = config.replace(/\\/g, "\\\\").replace(/"/g, '\\"').replace(/\n/g, "\\n").replace(/\r/g, "\\r");
+ const escapedFilePath = filePath.replace(/\\/g, "\\\\").replace(/"/g, '\\"');
const html = `
@@ -72,8 +79,8 @@ export default class ViewLoader {
@@ -86,7 +93,7 @@ export default class ViewLoader {
}
private encodeContent(text: string, fileName: string): any {
- if (fileName.endsWith(".yaml")) {
+ if (fileName && fileName.endsWith(".yaml")) {
return Base64.encode(JSON.stringify(yamlLoad(text)));
}
return Base64.encode(text);
diff --git a/packages/vscode/src/view/app/index.tsx b/packages/vscode/src/view/app/index.tsx
index 2d2d1283..c955cb7f 100644
--- a/packages/vscode/src/view/app/index.tsx
+++ b/packages/vscode/src/view/app/index.tsx
@@ -1,3 +1,4 @@
+import * as React from 'react';
import { createRoot } from 'react-dom/client';
import { QuickStartsPreview } from './quickstarts';
@@ -11,14 +12,27 @@ declare global {
}
}
-const vscode = window.acquireVsCodeApi();
-
-const root = createRoot(document.getElementById('root'));
-
-root.render(
- ,
-);
+try {
+ const vscode = window.acquireVsCodeApi();
+ const rootElement = document.getElementById('root');
+ if (!rootElement) {
+ console.error('Root element not found!');
+ } else {
+ const root = createRoot(rootElement);
+ root.render(
+ ,
+ );
+ }
+} catch (error) {
+ console.error('Error in webview:', error);
+ document.body.innerHTML = `
+
Error loading preview
+
${error instanceof Error ? error.stack : String(error)}
+
initialData: ${window.initialData ? 'present (' + window.initialData.length + ' chars)' : 'missing'}
+
filePath: ${window.filePath || 'missing'}
+
Error: No data provided to preview
;
+ }
+
+ try {
+ const decodedConfig = Base64.decode(config);
+ const allQuickStarts = [];
+ if (filePath && filePath.endsWith('.adoc')) {
+ const parsedConfig = JSON.parse(decodedConfig);
+ allQuickStarts.push(ProcQuickStartParser(parsedConfig));
+ } else {
+ const parsed = JSON.parse(decodedConfig);
+ allQuickStarts.push(parsed);
+ }
+
+ const [activeQuickStartID, setActiveQuickStartID] = useLocalStorage('quickstartId', '');
+ const [allQuickStartStates, setAllQuickStartStates] = useLocalStorage('quickstarts', {});
+ const valuesForQuickstartContext = useValuesForQuickStartContext({
+ allQuickStarts,
+ activeQuickStartID,
+ setActiveQuickStartID,
+ allQuickStartStates,
+ setAllQuickStartStates,
+ });
+ return (
+
+
+
+
+
+ );
+ } catch (error) {
+ console.error('Error in QuickStartsPreview:', error);
+ return (
+
+
Error rendering Quick Start
+
{error instanceof Error ? error.stack : String(error)}
+
Config length: {config?.length || 0}
+
File path: {filePath || 'missing'}
+