documentation for tests

Hello,

Unfortunately, I can’t find any example or documentation on how to write tests with Hilla. Can someone help?

I wanted to start with a unit test of a component and test a method of a component. For this I used Jest and got the following error:

Jest encountered an unexpected token
...
... /node_modules/@hilla/frontend/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){export * from './Authentication.js';

Thanks in advance, Oliver

We still need to add documentation for how to test Hilla app frontends. There’s a GH issue here you can follow Add documentation for testing Hilla apps · Issue #1231 · vaadin/docs · GitHub

@tireless-elk or @flexible-kiwi may have some quick tips in the meantime

hi, I haven’t tried it with Jest, but the error message you quoted suggests to me that it tries to load our ES module library as CommonJS code. I found this article in Jest docs about ES module support, maybe it helps: https://jestjs.io/docs/ecmascript-modules

If you are open to consider other testing frameworks, I’d suggest to give web-test-runner a go. I believe it is a better fit for testing web components, as it runs tests in the browser (not JSDOM as in Jest), which might save you from facing issues of underlying DOM implementation differences between the testing environment and real browsers. Also it has first-class support of ES modules. See here to get started: https://modern-web.dev/guides/test-runner/getting-started/
and also this article for configuring TypeScript support: https://modern-web.dev/guides/test-runner/typescript/