codebase updates & more abstractions

README.md

@@ -42,14 +42,29 @@ Options:
     "htmlbars-inline-precompile": "default",
     "ember-cli-htmlbars-inline-precompile": "default",
     "@glimmerx/component": "hbs",
+    "@glimmer/core": ["createTemplate", "precompileTemplate"]
   }
   ```
 
-- `babylonPlugins` - [Optional] The **additional** babylon plugins to use, e.g. `[ 'typescipt', 'jsx' ]`, see:
- https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/babylon/index.d.ts#L45.
+- `parse` -  parser function.
+  ```js
+    // usage example #1
+    import { parse } from 'babylon';
+    function parseFunction(source) {
+      return parse(source, { sourceType: 'module', plugins:  ['classProperties', 'flow'] });
+    }
+    getTemplateNodes(source, { parse: parseFunction });
 
-  Default used babylon plugins: `[ 'flow', 'classProperties' ]`
+  ```
 
+  ```js
+    // usage example #2
+    import { parseScriptFile } from 'ember-meta-explorer';
+    function parseFunction(source) {
+      return parseScriptFile(source);
+    }
+    getTemplateNodes(source, { parse: parseFunction });
+  ```
 - `sortByStartKey` - [Optional] The extracted template nodes from the **ast** will not be ordered by their original
  position in the source, so we can sort them using the `start` key, `false` by default.
 

package.json

@@ -30,18 +30,19 @@
   "devDependencies": {
     "@types/babel-traverse": "^6.25.5",
     "@types/babylon": "^6.16.5",
-    "@types/jest": "^24.0.18",
+    "@types/jest": "^26.0.20",
     "@types/node": "^12.12.6",
-    "jest": "^24.9.0",
-    "prettier": "^1.18.2",
-    "ts-jest": "^24.0.2",
-    "tslint": "^5.20.1",
+    "jest": "^26.6.3",
+    "prettier": "^2.2.1",
+    "ts-jest": "^26.4.4",
+    "tslint": "^6.1.3",
     "tslint-config-prettier": "^1.18.0",
-    "typescript": "^3.6.2"
+    "typescript": "^4.1.3",
+    "ember-meta-explorer": "^0.2.1",
+    "babylon": "^6.18.0"
   },
   "dependencies": {
-    "babel-traverse": "^6.26.0",
-    "babylon": "^6.18.0"
+    "babel-traverse": "^6.26.0"
   },
   "engines": {
     "node": "6.* || 8.* || >= 10.*"

src/__tests__/searchAndExtractHbs.test.ts

@@ -1,31 +1,66 @@
-import { readFileSync } from 'fs';
-import { resolve } from 'path';
+import { readFileSync } from "fs";
+import { resolve } from "path";
 import { searchAndExtractHbs } from "../index";
 
-const readFile = (path: any) => readFileSync(resolve(__dirname, path), { encoding: 'utf-8'});
+import { parse } from "babylon";
 
-test('with single multiline tagged template', () => {
-  const component = readFile('./with-single-multiline-tagged-template/component.ts');
-  const template = readFile('./with-single-multiline-tagged-template/template.hbs');
+import { parseScriptFile } from "ember-meta-explorer";
 
-  expect(searchAndExtractHbs(component)).toBe(template);
-});
+const readFile = (path: any) => clean(readFileSync(resolve(__dirname, path), { encoding: "utf-8" }));
 
-test("with additional hbs tag sources", () => {
-  const component = readFile('./with-additional-hbs-tag-sources/custom-hbs-tag-sources-component-test.js');
-  const template = readFile('./with-additional-hbs-tag-sources/template.hbs');
+function clean(source: string): string {
+  return source.replace(/(?:\\[rn]|[\r\n])/g, "\n");
+}
 
-  expect(searchAndExtractHbs(component, {
-    hbsTagSources: {
-      "my-custom-hbs-source": "default",
-      "another-custom-hbs-source": "handlebars"
-    }
-  })).toBe(template);
-});
+const parsers = [
+  {
+    name: "Parser #1 (babylon)",
+    parse(source: string) {
+      return parse(source, { sourceType: "module", plugins: ["classProperties", "flow"] });
+    },
+  },
+  {
+    name: "Parser #2 (ember-meta-explorer)",
+    parse(source: string) {
+      return parseScriptFile(source);
+    },
+  },
+];
+
+parsers.forEach((parser) => {
+  test(`${parser.name}: with single multiline tagged template`, () => {
+    const component = readFile("./with-single-multiline-tagged-template/component.ts");
+    const template = readFile("./with-single-multiline-tagged-template/template.hbs");
+
+    expect(searchAndExtractHbs(component, { parse: parser.parse })).toBe(template);
+  });
+
+  test(`${parser.name}: with additional hbs tag sources`, () => {
+    const component = readFile("./with-additional-hbs-tag-sources/custom-hbs-tag-sources-component-test.js");
+    const template = readFile("./with-additional-hbs-tag-sources/template.hbs");
+
+    expect(
+      searchAndExtractHbs(component, {
+        hbsTagSources: {
+          "my-custom-hbs-source": "default",
+          "another-custom-hbs-source": "handlebars",
+        },
+        parse: parser.parse
+      }),
+    ).toBe(template);
+  });
+
+  test(`${parser.name}: with both tagged *hbs\`template\`* and string literal *hbs('template')* formats`, () => {
+    const component = readFile("./with-both-tagged-and-string-literal-formats/test-inline-precompile-test.js");
+    const template = readFile("./with-both-tagged-and-string-literal-formats/template.hbs");
+
+    expect(searchAndExtractHbs(component, { parse: parser.parse })).toBe(template);
+  });
 
-test("with both tagged *hbs`template`* and string literal *hbs('template')* formats", () => {
-  const component = readFile('./with-both-tagged-and-string-literal-formats/test-inline-precompile-test.js');
-  const template = readFile('./with-both-tagged-and-string-literal-formats/template.hbs');
+  test(`${parser.name}: with low-level glimmer api`, () => {
+    const component = readFile("./with-glimmer-api/component.ts");
+    const template = readFile("./with-glimmer-api/template.hbs");
 
-  expect(searchAndExtractHbs(component)).toBe(template);
+    expect(searchAndExtractHbs(component, { parse: parser.parse })).toBe(template);
+  });
 });

src/__tests__/with-glimmer-api/component.ts

@@ -0,0 +1,31 @@
+// @ts-ignore
+import { setComponentTemplate, precompileTemplate, createTemplate } from '@glimmer/core';
+
+
+setComponentTemplate(
+    precompileTemplate(
+      { Foo: 42 },
+      '<ChildComponent @firstName={{this.firstName}} @status={{this.status4}} />'
+    )
+);
+
+setComponentTemplate(
+    precompileTemplate(
+      '<ChildComponent @firstName={{this.firstName}} @status={{this.status3}} />'
+    )
+);
+
+
+setComponentTemplate(
+    createTemplate(
+      { Foo: 42 },
+      '<ChildComponent @firstName={{this.firstName}} @status={{this.status0}} />'
+    )
+);
+
+
+setComponentTemplate(
+    createTemplate(
+      `<ChildComponent @firstName={{this.firstName}} @status={{this.status1}} />`
+    )
+);

src/__tests__/with-glimmer-api/template.hbs

@@ -0,0 +1,29 @@
+
+
+
+
+
+
+
+       <ChildComponent @firstName={{this.firstName}} @status={{this.status4}} />
+
+
+
+
+
+       <ChildComponent @firstName={{this.firstName}} @status={{this.status3}} />
+
+
+
+
+
+
+
+       <ChildComponent @firstName={{this.firstName}} @status={{this.status0}} />
+
+
+
+
+
+
+       <ChildComponent @firstName={{this.firstName}} @status={{this.status1}} />