add lit-element

[bennypowers]

Note: jest needs some encouragement to import javascript modules from other javascript modules.

[kentcdodds]

Thanks! I'm not sure what's up with Travis. Is this working for you locally?

Also, I just want to make sure. Are you cool with this? https://github.com/kentcdodds/dom-testing-library-with-anything/commit/173e638fbbf0a6b050f42913b49976181442f020

If not then feel free to close the PR, that's fine.

[bennypowers]

No, jest pukes on the lit-html module, which is just a JavaScript module, then complains that is not real js. 🤷‍♂️. Stay classy, Babel.

[bennypowers]

And yeah you can use this example in your course

[kentcdodds]

babel doesn't transpile files found in node_modules by default. Do they have a commonjs version of the module? Otherwise we'll probably have to add a babel.config.js file which will allow us to configure transpiling node_modules files. I think that'd work, though I'm not 100% certain. Could you look into what it takes to make lit-html work with jest?

[bennypowers]

Could you run Jest with esm?

[kentcdodds]

Maybe! You could probably just add an import of esm at the top of your test file. Give it a try!

[bennypowers]

Ok last commit wrangles jest with modules, but it's not pretty.

more info: Seems like the official line is that everyone wants it but it's not ready yet https://github.com/facebook/jest/issues/4842#issuecomment-401877985

There's an example here: https://github.com/kenotron/esm-jestwhich requires swapping out the test runner.

https://github.com/web-padawan/lit-components/ are using karma with babel transforms, should work out of the box with -r esm

I've used tape in the past with -r esm and it was a dream.

New Problem

document is not defined. Going to look into this a bit.

[kentcdodds]

Maybe this will help? https://github.com/kenotron/esm-jest

[bennypowers]

The problem is deeper than than, we need a way to mock the browser in jest

justin fagnani over in the polymer slack suggested using puppeteer instead of jest. that would be a major change, but might be worth your considering, especially since the first word in the project title is dom ;)

[kentcdodds]

we need a way to mock the browser in jest

Jest does this by default with jsdom (that's what all the other frameworks are relying on).

justin fagnani over in the polymer slack suggested using puppeteer instead of jest

Nope. I don't think it's necessary to use puppeteer. All the other frameworks are working fine with the current setup with jest and jsdom. We'll need to figure out how to make this work with the current setup. I don't think adding puppeteer is necessary at all.