Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: lookbehind simplifies transformIgnorePatterns & ensures correctness #4

Merged
merged 2 commits into from
Apr 10, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
*.DS_Store

# NPM
node_modules
/node_modules
npm-debug.log

# Build
Expand Down
10 changes: 5 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,8 +67,8 @@ module.exports = {
moduleFileExtensions: defaults.moduleFileExtensions.concat("marko"),
// preprocesses Marko files.
transform: { "\\.marko$": "@marko/jest" },
// transforms top level `.marko` files in the Marko package.
transformIgnorePatterns: ["node_modules/(?!(marko)/)"]
// transforms `.marko` files in node_modules as well
transformIgnorePatterns: ["node_modules/.*(?<!\\.marko)$"]
browser: true
};
```
Expand Down Expand Up @@ -131,16 +131,16 @@ In the above example config, any tests with `*.browser.js` will run in a JSDOM c

## Using tags from npm

By default Jest will not transform any `.marko` files within your `node_modules` folder. Marko recommends publishing the original source Marko files when publishing to npm. To get around this you can use the [`transformIgnorePatterns`](https://jestjs.io/docs/en/tutorial-react-native#transformignorepatterns-customization) option in Jest and whitelist any packages which contain Marko tags.
By default Jest will not transform any `.marko` files within your `node_modules` folder. Marko recommends publishing the original source Marko files when publishing to npm. To get around this you can use the [`transformIgnorePatterns`](https://jestjs.io/docs/en/tutorial-react-native#transformignorepatterns-customization) option in Jest and whitelist `.marko` files.

The `@marko/jest` preset by will scan your `node_modules` and build the appropriate ignore pattern for you. If you are just using the `@marko/jest` transformer standalone then you will have to do this yourself, like so:
The `@marko/jest` preset sets the ignore pattern for you. If you are just using the `@marko/jest` transformer standalone then you will have to do this yourself, like so:

**jest.config.js**

```javascript
module.exports = {
...,
transformIgnorePatterns: ["node_modules/(?!(marko|@marko-tags|another-package-with-marko-tags)/)"]
transformIgnorePatterns: ["node_modules/.*(?<!\\.marko)$"]
};
```

Expand Down
23 changes: 2 additions & 21 deletions jest-preset.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,4 @@
const fs = require("fs");
const path = require("path");
const { defaults } = require("jest-config");
const escapeRegexp = require("escape-string-regexp");
const { package, path: packagePath } = require("read-pkg-up").sync({
normalize: false
});
const nodeModulesPath = path.join(packagePath, "../node_modules");

module.exports = {
// uses a webpack style resolver, the default one has many issues.
Expand All @@ -18,18 +11,6 @@ module.exports = {
"\\.[tj]s$": "babel-jest"
},
// Jest ignores node_module transforms by default.
// Here we whitelist all node_modules that contain a `marko.json`.
// Only checks for node_modules listed in package.json, same as Marko taglib scanning.
transformIgnorePatterns: [
`node_modules/(?!(${Object.keys(package.dependencies || {})
.concat(Object.keys(package.devDependencies || {}))
.concat(Object.keys(package.peerDependencies || {}))
.filter((name, i, all) => all.indexOf(name) === i)
.filter(name =>
fs.existsSync(path.join(nodeModulesPath, name, "marko.json"))
)
.map(escapeRegexp)
.concat("marko")
.join("|")})/)`
]
// Here we whitelist all `.marko` files.
transformIgnorePatterns: ["node_modules/.*(?<!\\.marko)$"]
};
2 changes: 0 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,7 @@
"bugs": "https://github.com/marko-js/jest/issues",
"dependencies": {
"enhanced-resolve-jest": "^1.0.2",
"escape-string-regexp": "^2.0.0",
"jest-config": "^24.8.0",
"read-pkg-up": "^6.0.0",
"tslib": "^1.10.0"
},
"devDependencies": {
Expand Down
9 changes: 9 additions & 0 deletions test/browser.test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Example from "./fixtures/example.marko";
import Mockable from "./fixtures/mockable.marko";
import Project from "./fixtures/project/index.marko";

afterEach(() => {
document.body.innerHTML = "";
Expand All @@ -21,3 +22,11 @@ test("can be mocked", async () => {
`"<div>Hello Mocked</div>"`
);
});

test("transforms templates in node_modules", async () => {
const result = await Project.render({});
result.appendTo(document.body).getComponent();
expect(document.body.innerHTML).toMatchInlineSnapshot(
`"<div class=\\"direct\\"><div class=\\"indirect\\">Hello World</div></div>"`
);
});
3 changes: 3 additions & 0 deletions test/fixtures/project/index.marko
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<direct-tag>
Hello World
</direct-tag>
2 changes: 2 additions & 0 deletions test/fixtures/project/index.marko.d.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
declare let x: any;
export = x;
5 changes: 5 additions & 0 deletions test/fixtures/project/node_modules/direct/index.marko

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions test/fixtures/project/node_modules/direct/marko.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 6 additions & 0 deletions test/fixtures/project/node_modules/direct/package.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

5 changes: 5 additions & 0 deletions test/fixtures/project/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"dependencies": {
"direct": "*"
}
}
7 changes: 7 additions & 0 deletions test/server.test.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Example from "./fixtures/example.marko";
import Mockable from "./fixtures/mockable.marko";
import Project from "./fixtures/project/index.marko";

test("server rendering", () => {
expect(Example.renderSync({}).toString()).toMatchInlineSnapshot(
Expand All @@ -13,3 +14,9 @@ test("can be mocked", async () => {
`"<div>Hello Mocked</div>"`
);
});

test("transforms templates in node_modules", () => {
expect(Project.renderSync({}).toString()).toMatchInlineSnapshot(
`"<div class=\\"direct\\"><div class=\\"indirect\\">Hello World</div></div>"`
);
});