Add source maps for JS and TS files (#3204)

app/ide-desktop/lib/content/package.js

@@ -17,6 +17,7 @@ let config = {
         'compression-webpack-plugin': '^3.1.0',
         'copy-webpack-plugin': '^5.1.1',
         'yaml-loader': '^0.6.0',
+        'source-map-loader': '^1.0.0',
         'ts-loader': '^8.0.3',
         typescript: '^4.0.2',
         webpack: '^4.44.1',

app/ide-desktop/lib/content/tsconfig.json

@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "sourceMap": true,
     "noImplicitAny": true,
     "target": "ES5",
     "module": "ES2015"

app/ide-desktop/lib/content/webpack.config.js

@@ -16,6 +16,24 @@ function git(command) {
 
 const BUILD_INFO = JSON.parse(require('fs').readFileSync(buildPath, 'utf8'))
 
+// scala-parser.js is compiled from Scala code, so no source map is available for it.
+const IGNORE_SOURCE_MAPS = [/scala-parser\.js/]
+
+// Load source maps for JS and TS files, so we will have an accurate source available in DevTools.
+// `ignored` is a list of regexes that are matched against file URL to ignore missing source
+// maps for certain files.
+const sourceMapLoader = ignored => ({
+    loader: 'source-map-loader',
+    options: {
+        filterSourceMappingUrl: (url, _resourcePath) => {
+            for (let regexp of ignored) {
+                if (regexp.test(url)) return 'skip'
+            }
+            return true
+        },
+    },
+})
+
 module.exports = {
     entry: {
         index: path.resolve(thisPath, 'src', 'index.ts'),
@@ -46,6 +64,7 @@ module.exports = {
             FIREBASE_API_KEY: JSON.stringify(process.env.FIREBASE_API_KEY),
         }),
     ],
+    devtool: 'eval-source-map',
     devServer: {
         publicPath: '/assets/',
         historyApiFallback: {
@@ -79,6 +98,11 @@ module.exports = {
                 test: /\.html$/i,
                 loader: 'html-loader',
             },
+            {
+                test: [/\.js$/, /\.tsx?$/],
+                enforce: 'pre',
+                loader: sourceMapLoader(IGNORE_SOURCE_MAPS),
+            },
         ],
     },
 }

app/ide-desktop/package-lock.json

@@ -27,6 +27,7 @@
 				"mocha": "^8.2.1",
 				"mock-fs": "^4.13.0",
 				"sharp": "^0.26.2",
+				"source-map-loader": "^1.0.0",
 				"tar": "^6.0.5",
 				"to-ico": "^1.1.5",
 				"ts-loader": "^8.0.3",
@@ -2612,6 +2613,11 @@
 			"resolved": "https://registry.npmjs.org/7zip-bin/-/7zip-bin-5.1.1.tgz",
 			"integrity": "sha512-sAP4LldeWNz0lNzmTird3uWfFDWWTeg6V/MsmyyLR9X1idwKBWIgt/ZvinqQldJm3LecKEs1emkbquO6PCiLVQ=="
 		},
+		"node_modules/abab": {
+			"version": "2.0.5",
+			"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.5.tgz",
+			"integrity": "sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q=="
+		},
 		"node_modules/abbrev": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
@@ -7079,9 +7085,9 @@
 			}
 		},
 		"node_modules/electron/node_modules/@types/node": {
-			"version": "12.20.37",
+			"version": "12.20.38",
-			"resolved": "https://registry.npmjs.org/@types/node/-/node-12.20.37.tgz",
+			"resolved": "https://registry.npmjs.org/@types/node/-/node-12.20.38.tgz",
-			"integrity": "sha512-i1KGxqcvJaLQali+WuypQnXwcplhtNtjs66eNsZpp2P2FL/trJJxx/VWsM0YCL2iMoIJrbXje48lvIQAQ4p2ZA=="
+			"integrity": "sha512-NxmtBRGipjx1B225OeMdI+CQmLbYqvvmYbukDTJGDgzIDgPQ1EcjGmYxGhOk5hTBqeB558S6RgHSpq2iiqifAQ=="
 		},
 		"node_modules/elliptic": {
 			"version": "6.5.3",
@@ -15528,6 +15534,81 @@
 				"node": ">=0.10.0"
 			}
 		},
+		"node_modules/source-map-loader": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-1.1.3.tgz",
+			"integrity": "sha512-6YHeF+XzDOrT/ycFJNI53cgEsp/tHTMl37hi7uVyqFAlTXW109JazaQCkbc+jjoL2637qkH1amLi+JzrIpt5lA==",
+			"dependencies": {
+				"abab": "^2.0.5",
+				"iconv-lite": "^0.6.2",
+				"loader-utils": "^2.0.0",
+				"schema-utils": "^3.0.0",
+				"source-map": "^0.6.1",
+				"whatwg-mimetype": "^2.3.0"
+			},
+			"engines": {
+				"node": ">= 10.13.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/webpack"
+			},
+			"peerDependencies": {
+				"webpack": "^4.0.0 || ^5.0.0"
+			}
+		},
+		"node_modules/source-map-loader/node_modules/json5": {
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
+			"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
+			"dependencies": {
+				"minimist": "^1.2.5"
+			},
+			"bin": {
+				"json5": "lib/cli.js"
+			},
+			"engines": {
+				"node": ">=6"
+			}
+		},
+		"node_modules/source-map-loader/node_modules/loader-utils": {
+			"version": "2.0.2",
+			"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.2.tgz",
+			"integrity": "sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A==",
+			"dependencies": {
+				"big.js": "^5.2.2",
+				"emojis-list": "^3.0.0",
+				"json5": "^2.1.2"
+			},
+			"engines": {
+				"node": ">=8.9.0"
+			}
+		},
+		"node_modules/source-map-loader/node_modules/schema-utils": {
+			"version": "3.1.1",
+			"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
+			"integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
+			"dependencies": {
+				"@types/json-schema": "^7.0.8",
+				"ajv": "^6.12.5",
+				"ajv-keywords": "^3.5.2"
+			},
+			"engines": {
+				"node": ">= 10.13.0"
+			},
+			"funding": {
+				"type": "opencollective",
+				"url": "https://opencollective.com/webpack"
+			}
+		},
+		"node_modules/source-map-loader/node_modules/source-map": {
+			"version": "0.6.1",
+			"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+			"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/source-map-resolve": {
 			"version": "0.5.3",
 			"resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz",
@@ -18171,6 +18252,11 @@
 			"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz",
 			"integrity": "sha512-dcQ1GWpOD/eEQ97k66aiEVpNnapVj90/+R+SXTPYGHpYBBypfKJEQjLrvMZ7YXbKm21gXd4NcuxUTjiv1YtLng=="
 		},
+		"node_modules/whatwg-mimetype": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
+			"integrity": "sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g=="
+		},
 		"node_modules/whatwg-url": {
 			"version": "7.1.0",
 			"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",
@@ -20994,6 +21080,11 @@
 			"resolved": "https://registry.npmjs.org/7zip-bin/-/7zip-bin-5.1.1.tgz",
 			"integrity": "sha512-sAP4LldeWNz0lNzmTird3uWfFDWWTeg6V/MsmyyLR9X1idwKBWIgt/ZvinqQldJm3LecKEs1emkbquO6PCiLVQ=="
 		},
+		"abab": {
+			"version": "2.0.5",
+			"resolved": "https://registry.npmjs.org/abab/-/abab-2.0.5.tgz",
+			"integrity": "sha512-9IK9EadsbHo6jLWIpxpR6pL0sazTXV6+SQv25ZB+F7Bj9mJNaOc4nCRabwd5M/JwmUa8idz6Eci6eKfJryPs6Q=="
+		},
 		"abbrev": {
 			"version": "1.1.1",
 			"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
@@ -24223,9 +24314,9 @@
 			},
 			"dependencies": {
 				"@types/node": {
-					"version": "12.20.37",
+					"version": "12.20.38",
-					"resolved": "https://registry.npmjs.org/@types/node/-/node-12.20.37.tgz",
+					"resolved": "https://registry.npmjs.org/@types/node/-/node-12.20.38.tgz",
-					"integrity": "sha512-i1KGxqcvJaLQali+WuypQnXwcplhtNtjs66eNsZpp2P2FL/trJJxx/VWsM0YCL2iMoIJrbXje48lvIQAQ4p2ZA=="
+					"integrity": "sha512-NxmtBRGipjx1B225OeMdI+CQmLbYqvvmYbukDTJGDgzIDgPQ1EcjGmYxGhOk5hTBqeB558S6RgHSpq2iiqifAQ=="
 				}
 			}
 		},
@@ -31230,6 +31321,54 @@
 			"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
 			"integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w="
 		},
+		"source-map-loader": {
+			"version": "1.1.3",
+			"resolved": "https://registry.npmjs.org/source-map-loader/-/source-map-loader-1.1.3.tgz",
+			"integrity": "sha512-6YHeF+XzDOrT/ycFJNI53cgEsp/tHTMl37hi7uVyqFAlTXW109JazaQCkbc+jjoL2637qkH1amLi+JzrIpt5lA==",
+			"requires": {
+				"abab": "^2.0.5",
+				"iconv-lite": "^0.6.2",
+				"loader-utils": "^2.0.0",
+				"schema-utils": "^3.0.0",
+				"source-map": "^0.6.1",
+				"whatwg-mimetype": "^2.3.0"
+			},
+			"dependencies": {
+				"json5": {
+					"version": "2.2.0",
+					"resolved": "https://registry.npmjs.org/json5/-/json5-2.2.0.tgz",
+					"integrity": "sha512-f+8cldu7X/y7RAJurMEJmdoKXGB/X550w2Nr3tTbezL6RwEE/iMcm+tZnXeoZtKuOq6ft8+CqzEkrIgx1fPoQA==",
+					"requires": {
+						"minimist": "^1.2.5"
+					}
+				},
+				"loader-utils": {
+					"version": "2.0.2",
+					"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.2.tgz",
+					"integrity": "sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A==",
+					"requires": {
+						"big.js": "^5.2.2",
+						"emojis-list": "^3.0.0",
+						"json5": "^2.1.2"
+					}
+				},
+				"schema-utils": {
+					"version": "3.1.1",
+					"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz",
+					"integrity": "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==",
+					"requires": {
+						"@types/json-schema": "^7.0.8",
+						"ajv": "^6.12.5",
+						"ajv-keywords": "^3.5.2"
+					}
+				},
+				"source-map": {
+					"version": "0.6.1",
+					"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+					"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
+				}
+			}
+		},
 		"source-map-resolve": {
 			"version": "0.5.3",
 			"resolved": "https://registry.npmjs.org/source-map-resolve/-/source-map-resolve-0.5.3.tgz",
@@ -33332,6 +33471,11 @@
 			"resolved": "https://registry.npmjs.org/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz",
 			"integrity": "sha512-dcQ1GWpOD/eEQ97k66aiEVpNnapVj90/+R+SXTPYGHpYBBypfKJEQjLrvMZ7YXbKm21gXd4NcuxUTjiv1YtLng=="
 		},
+		"whatwg-mimetype": {
+			"version": "2.3.0",
+			"resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz",
+			"integrity": "sha512-M4yMwr6mAnQz76TbJm914+gPpB/nCwvZbJU28cUD6dR004SAxDLOOSUaB1JDRqLtaOV/vi0IC5lEAGFgrjGv/g=="
+		},
 		"whatwg-url": {
 			"version": "7.1.0",
 			"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.1.0.tgz",