Angular test doesn't start

[konstantinschuette]

trafficstars

Describe the bug Partially similar to this I think: https://github.com/phenomnomnominal/betterer/issues/1128

To Reproduce Repo: https://github.com/konstantinschuette/angular-betterer

1. ng new angular-betterer
2. npx @betterer/cli init
3. npm install --save-dev @betterer/angular
4. Added the config from the documentation to .betterer.ts
5. npm run betterer Expected behavior Running betterer with the Angular config should start without any errors

Errors Errors with @betterer/angular 5.4.0 and @betterer/cli at 6.0.0-alpha.1:

file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/render/dist/index.js:18914
                throw ex;
                ^
Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@angular/compiler-cli/bundles/index.js from /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js not supported.
Instead change the require of index.js in /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js to a dynamic import() which is available in all CommonJS modules.
    at Object.<anonymous> (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js:4:24)
Emitted 'error' event on Worker instance at:
    at [kOnErrorMessage] (node:internal/worker:326:10)
    at [kOnMessage] (node:internal/worker:337:37)
    at MessagePort.<anonymous> (node:internal/worker:232:57)
    at [nodejs.internal.kHybridDispatch] (node:internal/event_target:826:20)
    at MessagePort.<anonymous> (node:internal/per_context/messageport:23:28) {
  code: 'ERR_REQUIRE_ESM'
}

Errors with @betterer/angular 5.4.0 and @betterer/cli at 5.4.0:

   \ | /     _         _   _                     
 '-.ooo.-'  | |__  ___| |_| |_ ___ _ __ ___ _ __ 
---ooooo--- | '_ \/ _ \ __| __/ _ \ '__/ _ \ '__|
 .-'ooo'-.  | |_)|  __/ |_| ||  __/ | |  __/ |   
   / | \    |_.__/\___|\__|\__\___|_|  \___|_|   
 

Error: could not import config from "/Users/konstantinschutte/Desktop/Github/angular-betterer/.betterer.ts". 😔
      at loadTestMetaFromConfig (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/test/loader.ts:30:11)
      at /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/test/loader.ts:11:22
      at Array.map (<anonymous>)
      at loadTestMeta (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/test/loader.ts:10:22)
      at BettererContextΩ.run (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/context/context.ts:83:36)
      at async BettererContextΩ.runOnce (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/context/context.ts:111:7)
      at async betterer (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/betterer/src/betterer.ts:31:10)
      at async Command.<anonymous> (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/src/start.ts:38:28)
      at async Command.parseAsync (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/commander/lib/command.js:923:5)
      at async Object.cli__ (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/src/cli.ts:58:3)

Error: require() of ES Module /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@angular/compiler-cli/bundles/index.js from /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js not supported.
       Instead change the require of index.js in /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js to a dynamic import() which is available in all CommonJS modules.
  Instead change the require of index.js in /Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js to a dynamic import() which is available in all CommonJS modules.
      at require.extensions.<computed> [as .js] (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/ts-node/dist/index.js:851:20)
      at Object.<anonymous> (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/angular/dist/angular.js:4:24)
      at require.extensions.<computed> [as .js] (/Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/ts-node/dist/index.js:851:20)

Expected behavior I would expect that betterer runs with the default angular tsconfig.

Versions (please complete the following information):

• OS: MacOS 15.3 (24D60)
• Betterer Version 5.4.0 & 6.0.0-alpha.1
• Node Version 20.12.2

[phenomnomnominal]

Hey! This is an annoying one - the build output of @betterer/[email protected] has requires in it, and my publish scripts didn't pick up the change to output formatting as a breaking change so it didn't publish a v6 version. You should be able to get it working if you add a local copy of the Angular test into your project. I am moving from Lerna to Nx to make publishing easier/better and then I'll publish a alpha.2 of everything and then it should work 🤞🏻

[konstantinschuette]

Thanks for the fast response. Will try it out on Monday

[konstantinschuette]

Not sure what I'm doing wrong but in the example repo I created, I'll always get this error when trying to use the angular config locally:

Error: could not import config from ".betterer.ts". 😔
      at loadTestMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:25:15)
      at async node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
      at async Promise.all (index 0)
      at async Object.loadTestsMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33)

Error: could not import ".betterer.ts". 😔
      at importTranspiledHashed (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:23:15)
      at async loadTestMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:21:40)
      at async node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
      at async Promise.all (index 0)
      at async Object.loadTestsMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33)

Error: could not import ".betterer.ts.7d115f67.betterer.tmp.mjs". 😔
      at importFrom (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:80:15)
      at async importTranspiledHashed (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:20:16)
      at async loadTestMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:21:40)
      at async node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
      at async Promise.all (index 0)
      at async Object.loadTestsMeta (node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33)
file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/render/dist/index.js:18914
                throw ex;
                ^

BettererError: could not import config from "/Users/konstantinschutte/Desktop/Github/angular-betterer/.betterer.ts". 😔
    at loadTestMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:25:15)
    at async file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
    at async Promise.all (index 0)
    at async Object.loadTestsMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33) {
  isBettererError: true,
  details: [
    Error: could not import "/Users/konstantinschutte/Desktop/Github/angular-betterer/.betterer.ts". 😔
        at importTranspiledHashed (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:23:15)
        at async loadTestMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:21:40)
        at async file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
        at async Promise.all (index 0)
        at async Object.loadTestsMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33),
    Error: could not import "/Users/konstantinschutte/Desktop/Github/angular-betterer/.betterer.ts.7d115f67.betterer.tmp.mjs". 😔
        at importFrom (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:80:15)
        at async importTranspiledHashed (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/fs/import.js:20:16)
        at async loadTestMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:21:40)
        at async file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:89
        at async Promise.all (index 0)
        at async Object.loadTestsMeta (file:///Users/konstantinschutte/Desktop/Github/angular-betterer/node_modules/@betterer/cli/node_modules/@betterer/betterer/dist/test/test-meta/loader.worker.js:6:33)
  ]
}

When I try it out in another repo, it's starting just fine. But there I face another issue. I use NX together with Angular. I tried to add only one folder like this:

export default {
  'stricter template compilation': () =>
    bettererAngular('./tsconfig.base.json', {
      strictTemplates: true
    }).include('./libs/car/**/*.ts', './libs/car/**/*.html')
};

But betterer tries checks every file from the repo. So the real includes pattern looks more like this apps/** and libs/**. The same includes path works just fine with the typescript config. I tried to reproduce this in my example repo but faced the issue I described in the beginning of this post