resolve failing webview issue

ShMcK · ShMcK · commit 4e94b71090da · 2019-09-07T20:06:16.000-07:00
diff --git a/src/editor/ReactWebView.ts b/src/editor/ReactWebView.ts
@@ -78,25 +78,14 @@ class ReactWebView {
 		// TODO: prevent window from moving to the left when no windows remain on rights
 	}
 
-	public createOrShow(column: number, callback?: () => void): void {
+	public createOrShow(column: number): void {
 		// If we already have a panel, show it.
 		// Otherwise, create a new panel.
 		if (this.panel && this.panel.webview) {
 			this.panel.reveal(column)
 		} else {
 			this.panel = this.createWebviewPanel(column)
 		}
-		if (callback) {
-			// listen for when webview is loaded
-			// unfortunately there is no easy way of doing this
-			const webPanelListener = setInterval(() => {
-				if (this.loaded) {
-					// callback tells editor the webview has loaded
-					setTimeout(callback)
-					clearInterval(webPanelListener)
-				}
-			}, 200)
-		}
 	}
 
 	public async postMessage(action: CR.Action): Promise<void> {
@@ -143,7 +132,7 @@ class ReactWebView {
 		const styles = [
 			'main.css',
 			// get style chunk
-			// Object.keys(manifest.files).find(f => f.match(/^static\/css\/.+\.css$/)) || ''
+			Object.keys(manifest.files).find(f => f.match(/^static\/css\/.+\.css$/)) || ''
 		].map(style => getSrc(style))
 
 		// map over scripts
@@ -161,7 +150,6 @@ class ReactWebView {
 			src: script.manifest ? getSrc(script.manifest) : script.file
 		}))
 
-
 		const indexHtml = `<!DOCTYPE html>
 			<html lang='en'>
 				<head>
@@ -173,14 +161,13 @@ class ReactWebView {
 
 						<link rel='stylesheet' href='https://unpkg.com/@alifd/next/dist/next.css' />
 						${styles.map(styleUri => `<link rel='stylesheet' type='text/css' href='${styleUri}'>`).join('\n')}
-
 						<meta http-equiv='Content-Security-Policy' content="font-src *; img-src vscode-resource: https:; script-src ${scripts.map(script => `'nonce-${script.nonce}'`).join(' ')}; style-src vscode-resource: 'unsafe-inline' http: https: data:;">
 						<base href='${buildUri}/'>
 				</head>
 
 				<body>
 						<noscript>You need to enable JavaScript to run this app.</noscript>
-						<div id='root'>Loading...</div>
+						<div id='root' style='background-color:white; padding: 1rem;'>Loading...</div>
 						${scripts.map(s => `<script nonce='${s.nonce}' src='${s.src}'></script>`).join('\n')}
 				</body>
 		</html>`
diff --git a/src/editor/commands/index.ts b/src/editor/commands/index.ts
@@ -37,6 +37,7 @@ export const createCommands = ({vscodeExt}: CreateCommandProps) => {
 	return {
 		// initialize
 		[COMMANDS.START]: async () => {
+			console.log('start')
 
 			await isEmptyWorkspace()
 
@@ -53,24 +54,13 @@ export const createCommands = ({vscodeExt}: CreateCommandProps) => {
 
 			// activate machine
 			webview = new ReactWebView(vscodeExt.extensionPath)
-			if (webviewState === 'INITIALIZING') {
-				// machine.activate()
-			} else if (webviewState === 'RESTARTING') {
-				setTimeout(() => {
-					// timeout hack to make data update on new windows
-					// @ts-ignore
-					machine.refresh()
-				}, 1000)
-			}
 		},
 		// open React webview
 		[COMMANDS.OPEN_WEBVIEW]: (column: number = vscode.ViewColumn.Two) => {
+			console.log('open webview')
 			// setup 1x1 horizontal layout
 			resetLayout()
-			const callback = () => {
-				// machine.send('WEBVIEW_INITIALIZED')
-			}
-			webview.createOrShow(column, callback)
+			webview.createOrShow(column)
 		},
 		[COMMANDS.TEST_RUNNER_SETUP]: async (codingLanguage: G.EnumCodingLanguage) => {
 
@@ -90,6 +80,13 @@ export const createCommands = ({vscodeExt}: CreateCommandProps) => {
 		[COMMANDS.OPEN_FILE]: async (relativeFilePath: string) => {
 			console.log(`OPEN_FILE ${JSON.stringify(relativeFilePath)}`)
 			try {
+				// TODO: reenable after testing
+				// const workspaceRoots: vscode.WorkspaceFolder[] | undefined = vscode.workspace.workspaceFolders
+				// if (!workspaceRoots || !workspaceRoots.length) {
+				// 	throw new Error('No workspace root path')
+				// }
+				// const rootWorkspace: vscode.WorkspaceFolder = workspaceRoots[0]
+				// const absoluteFilePath = join(rootWorkspace.uri.path, relativeFilePath)
 				const workspaceRoot = vscode.workspace.rootPath
 				if (!workspaceRoot) {
 					throw new Error('No workspace root path')
diff --git a/web-app/src/index.tsx b/web-app/src/index.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import * as React from 'react'
 import ReactDOM from 'react-dom'
 import App from './App'
 

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import React from 'react'`
	`1`	`+import * as React from 'react'`
`2`	`2`	`import ReactDOM from 'react-dom'`
`3`	`3`	`import App from './App'`
`4`	`4`