Web Extension Transformer (parcel-bundler#5304)

packages/bundlers/default/src/DefaultBundler.js

@@ -100,10 +100,7 @@ export default (new Bundler({
           for (let asset of assets) {
             let bundle = bundleGraph.createBundle({
               entryAsset: asset,
-              isEntry:
-                asset.isIsolated || asset.isInline
-                  ? false
-                  : Boolean(dependency.isEntry),
+              isEntry: asset.isInline ? false : Boolean(dependency.isEntry),
               isInline: asset.isInline,
               target: bundleGroup.target,
             });
@@ -490,11 +487,13 @@ async function loadBundlerConfig(options: PluginOptions) {
 
   validateSchema.diagnostic(
     CONFIG_SCHEMA,
-    config,
-    result.files[0].filePath,
-    result.config,
+    {
+      data: config,
+      source: JSON.stringify(config),
+      filePath: result.files[0].filePath,
+      prependKey: `/${encodeJSONKeyComponent('@parcel/bundler-default')}`,
+    },
     '@parcel/bundler-default',
-    `/${encodeJSONKeyComponent('@parcel/bundler-default')}`,
     'Invalid config for @parcel/bundler-default',
   );
 

packages/configs/webextension/index.json

@@ -0,0 +1,9 @@
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "manifest.json": ["@parcel/transformer-webextension"]
+  },
+  "packagers": {
+    "manifest.json": "@parcel/packager-raw-url"
+  }
+}

packages/configs/webextension/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "@parcel/config-webextension",
+  "version": "2.0.0-beta.1",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "funding": {
+    "type": "opencollective",
+    "url": "https://opencollective.com/parcel"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/parcel-bundler/parcel.git"
+  },
+  "main": "index.json",
+  "dependencies": {
+    "@parcel/config-default": "2.0.0-beta.1",
+    "@parcel/transformer-webextension": "2.0.0-beta.1",
+    "@parcel/packager-raw-url": "2.0.0-beta.1"
+  }
+}

packages/core/core/src/requests/ParcelConfigRequest.js

@@ -482,11 +482,8 @@ export function validateConfigFile(
 
   validateSchema.diagnostic(
     ParcelConfigSchema,
-    config,
-    relativePath,
-    JSON.stringify(config, null, '\t'),
+    {data: config, filePath: relativePath},
     '@parcel/core',
-    '',
     'Invalid Parcel Config',
   );
 }

packages/core/core/src/requests/TargetRequest.js

@@ -141,7 +141,7 @@ export class TargetResolver {
             name,
             _descriptor,
             null,
-            {targets: optionTargets},
+            JSON.stringify({targets: optionTargets}, null, '\t'),
           );
           if (distDir == null) {
             let optionTargetsString = JSON.stringify(optionTargets, null, '\t');
@@ -554,7 +554,7 @@ export class TargetResolver {
 function parseEngines(
   engines: mixed,
   pkgPath: ?FilePath,
-  pkgContents: string | mixed,
+  pkgContents: ?string,
   prependKey: string,
   message: string,
 ): Engines | typeof undefined {
@@ -563,14 +563,10 @@ function parseEngines(
   } else {
     validateSchema.diagnostic(
       ENGINES_SCHEMA,
-      engines,
-      pkgPath,
-      pkgContents,
+      {data: engines, source: pkgContents, filePath: pkgPath, prependKey},
       '@parcel/core',
-      prependKey,
       message,
     );
-
     // $FlowFixMe we just verified this
     return engines;
   }
@@ -580,15 +576,17 @@ function parseDescriptor(
   targetName: string,
   descriptor: mixed,
   pkgPath: ?FilePath,
-  pkgContents: string | mixed,
+  pkgContents: ?string,
 ): TargetDescriptor {
   validateSchema.diagnostic(
     DESCRIPTOR_SCHEMA,
-    descriptor,
-    pkgPath,
-    pkgContents,
+    {
+      data: descriptor,
+      source: pkgContents,
+      filePath: pkgPath,
+      prependKey: `/targets/${targetName}`,
+    },
     '@parcel/core',
-    `/targets/${targetName}`,
     `Invalid target descriptor for target "${targetName}"`,
   );
 
@@ -600,18 +598,19 @@ function parsePackageDescriptor(
   targetName: string,
   descriptor: mixed,
   pkgPath: ?FilePath,
-  pkgContents: string | mixed,
+  pkgContents: ?string,
 ): PackageTargetDescriptor {
   validateSchema.diagnostic(
     PACKAGE_DESCRIPTOR_SCHEMA,
-    descriptor,
-    pkgPath,
-    pkgContents,
+    {
+      data: descriptor,
+      source: pkgContents,
+      filePath: pkgPath,
+      prependKey: `/targets/${targetName}`,
+    },
     '@parcel/core',
-    `/targets/${targetName}`,
     `Invalid target descriptor for target "${targetName}"`,
   );
-
   // $FlowFixMe we just verified this
   return descriptor;
 }
@@ -620,15 +619,17 @@ function parseCommonTargetDescriptor(
   targetName: string,
   descriptor: mixed,
   pkgPath: ?FilePath,
-  pkgContents: string | mixed,
+  pkgContents: ?string,
 ): PackageTargetDescriptor | false {
   validateSchema.diagnostic(
     COMMON_TARGET_DESCRIPTOR_SCHEMA,
-    descriptor,
-    pkgPath,
-    pkgContents,
+    {
+      data: descriptor,
+      source: pkgContents,
+      filePath: pkgPath,
+      prependKey: `/targets/${targetName}`,
+    },
     '@parcel/core',
-    `/targets/${targetName}`,
     `Invalid target descriptor for target "${targetName}"`,
   );
 

packages/core/diagnostic/src/diagnostic.js

@@ -207,11 +207,17 @@ export default class ThrowableDiagnostic extends Error {
  * <code>type</code> signifies whether the key of the value in a JSON object should be highlighted.
  */
 export function generateJSONCodeHighlights(
-  code: string,
+  data:
+    | string
+    | {|
+        data: mixed,
+        pointers: {|[key: string]: Mapping|},
+      |},
   ids: Array<{|key: string, type?: ?'key' | 'value', message?: string|}>,
 ): Array<DiagnosticCodeHighlight> {
   // json-source-map doesn't support a tabWidth option (yet)
-  let map = jsonMap.parse(code.replace(/\t/g, ' '));
+  let map =
+    typeof data == 'string' ? jsonMap.parse(data.replace(/\t/g, ' ')) : data;
   return ids.map(({key, type, message}) => {
     let pos = nullthrows(map.pointers[key]);
     return {

packages/core/integration-tests/ready-yet-reporter.js

@@ -10,7 +10,7 @@ function importantData(test, status) {
     fileName,
     link: `https://github.com/parcel-bundler/parcel/tree/v2/packages/core/integration-tests/test/${fileName}.js`,
     title: test.title,
-    status
+    status,
   };
 }
 
@@ -37,24 +37,24 @@ function ReadyYetReporter(runner) {
     let commitHash = execSync('git rev-parse HEAD').toString();
     commitHash = commitHash.substring(0, commitHash.length - 1); // Get rid of newline
     let commitDate = execSync(
-      `git show -s --format=%ci ${commitHash}`
+      `git show -s --format=%ci ${commitHash}`,
     ).toString();
     commitDate = commitDate.substring(0, commitDate.lastIndexOf(' ')); // Get rid of timezone
     let testHistory = JSON.parse(
-      fs.readFileSync('data/testHistory.json', 'utf8')
+      fs.readFileSync('data/testHistory.json', 'utf8'),
     );
     let shouldWrite = testHistory.length === 0 || testHistory[0][2] !== ratio;
     if (shouldWrite) {
       testHistory.push([commitHash, commitDate, ratio]);
       fs.writeFileSync(
         'data/testHistory.json',
         JSON.stringify(testHistory),
-        'utf8'
+        'utf8',
       );
       fs.writeFileSync(
         'data/lastTestRun.json',
         JSON.stringify({tests}),
-        'utf8'
+        'utf8',
       );
     }
   });

packages/core/integration-tests/test/integration/webextension/.parcelrc

@@ -0,0 +1,3 @@
+{
+  "extends": ["@parcel/config-webextension"]
+}

packages/core/integration-tests/test/integration/webextension/_locales/en_US/messages.json

@@ -0,0 +1,29 @@
+{
+  "prompt_for_name": {
+    "message": "What's your name?",
+    "description": "Ask for the user's name"
+  },
+  "hello": {
+    "message": "Hello, $USER$",
+    "description": "Greet the user",
+    "placeholders": {
+      "user": {
+        "content": "$1",
+        "example": "Cira"
+      }
+    }
+  },
+  "bye": {
+    "message": "Goodbye, $USER$. Come back to $OUR_SITE$ soon!",
+    "description": "Say goodbye to the user",
+    "placeholders": {
+      "our_site": {
+        "content": "Example.com"
+      },
+      "user": {
+        "content": "$1",
+        "example": "Cira"
+      }
+    }
+  }
+}

packages/core/integration-tests/test/integration/webextension/dicts/tmp.aff

@@ -0,0 +1 @@
+World!!

packages/core/integration-tests/test/integration/webextension/dicts/tmp.dic

@@ -0,0 +1 @@
+Hello

packages/core/integration-tests/test/integration/webextension/manifest.json

@@ -0,0 +1,31 @@
+{
+  "manifest_version": 2,
+  "name": "Parcel WebExt",
+  "version": "0.1.2.65535",
+  "default_locale": "en_US",
+  "icons": {
+    "100": "src/assets/foo.png"
+  },
+  "background": {
+    "scripts": ["./src/background.js"],
+    "persistent": true
+  },
+  "browser_action": {
+    "default_icon": {
+      "100": "src/assets/foo.png"
+    },
+    "default_popup": "src/popup.html"
+  },
+  "content_scripts": [{
+    "matches": ["https://v2.parceljs.org/*"],
+    "js": ["src/content.js"],
+    "css": ["src/content.css"]
+  }],
+  "dictionaries": {
+    "en-US": "./dicts/tmp.dic"
+  },
+  "devtools_page": "src/devtools.html",
+  "web_accessible_resources": [
+    "src/assets/**/*.txt"
+  ]
+}

packages/core/integration-tests/test/integration/webextension/src/assets/a.txt

@@ -0,0 +1 @@
+Hello Parcel WebExt!

packages/core/integration-tests/test/integration/webextension/src/assets/nested/b.txt

@@ -0,0 +1 @@
+Hello Parcel WebExt (VERSION B)!

packages/core/integration-tests/test/integration/webextension/src/background.js

@@ -0,0 +1 @@
+console.log('Hello Parcel!')

packages/core/integration-tests/test/integration/webextension/src/content.css

@@ -0,0 +1,3 @@
+div::before {
+  content: 'Hello Parcel!'
+}

packages/core/integration-tests/test/integration/webextension/src/content.js

@@ -0,0 +1 @@
+console.log('Hello Parcel! CONTENT EDITION')

packages/core/integration-tests/test/integration/webextension/src/devtools.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Devtools</title>
+</head>
+<body>
+
+</body>
+</html>

packages/core/integration-tests/test/integration/webextension/src/popup.html

@@ -0,0 +1,11 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Popup</title>
+</head>
+<body>
+
+</body>
+</html>

packages/core/integration-tests/test/webext.js

@@ -0,0 +1,38 @@
+import path from 'path';
+import {bundle, assertBundles} from '@parcel/test-utils';
+
+describe('webextension', function() {
+  it('should resolve a full webextension bundle', async function() {
+    let b = await bundle(
+      path.join(__dirname, '/integration/webextension/manifest.json'),
+    );
+    assertBundles(b, [
+      {
+        name: 'tmp.aff',
+        assets: ['tmp.aff'],
+      },
+      {
+        name: 'tmp.dic',
+        assets: ['tmp.dic'],
+      },
+      {
+        name: 'messages.json',
+        assets: ['messages.json'],
+      },
+      {
+        name: 'manifest.json',
+        assets: ['manifest.json'],
+      },
+      // next three are implemented to have the same name, but theoretically
+      {assets: ['a.txt']},
+      {assets: ['b.txt']},
+      {assets: ['foo.png']},
+      {assets: ['popup.html']},
+      {assets: ['devtools.html']},
+      {assets: ['content.js']},
+      {assets: ['content.css']},
+      {assets: ['background.js']},
+    ]);
+  });
+  // TODO: Test error-checking
+});