angular / angular-cli

CLI tool for Angular
https://cli.angular.dev
MIT License
26.79k stars 11.98k forks source link

Feature request: loader option in new esbuild karma builder #28809

Open stefankoserkov opened 2 weeks ago

stefankoserkov commented 2 weeks ago

Command

test

Description

The improved builder @angular-devkit/build-angular:karma which uses esbuild is missing the "loader" option. It would be really useful to have the option to require files in tests.

Describe the solution you'd like

"test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "polyfills": [
              "zone.js",
              "zone.js/testing"
            ],
            "tsConfig": "tsconfig.spec.json",
            "assets": [
              {
                "glob": "**/*",
                "input": "public"
              }
            ],
            "styles": [
              "src/styles.css"
            ],
            "scripts": [],
            "builderMode": "application",
            **"loader": {
              ".html": "text"
            }**
          }
        }

Describe alternatives you've considered

No response

angular-robot[bot] commented 2 weeks ago

This feature request is now candidate for our backlog! In the next phase, the community has 60 days to upvote. If the request receives more than 20 upvotes, we'll move it to our consideration list.

You can find more details about the feature request process in our documentation.

jkrems commented 2 weeks ago

@stefankoserkov Would it be useful if that option would be used from what's already configured for the prod or dev builder? Or would there be cases where it should only apply to the test runner?

stefankoserkov commented 2 weeks ago

@jkrems I'd like it to be an option on the karma builder, to have better separation, but I'll take the other option as well.

If you are interested the case is that .html files will be required in tests to test something relating to iframes, which will not be used in prod/dev builds. But in our particular case I don't foresee side effects of this loader, if left in prod/dev build configs.

Thank you for the fast response!

jkrems commented 2 weeks ago

For a limited use in tests, you might also be able to use the import attribute syntax, e.g.:

import myTestHtml from './testdata/test.html' with { loader: 'text' };

If nothing else, this might be a workaround until we can more properly support loader in the Karma setup.

stefankoserkov commented 2 weeks ago

I like this workaround it's very cutting edge. However, for enterprise purposes I think it kind of deviates from the Angular path, I don't think we can afford to use module: esnext and declare .html files as modules. For now, I will try to gather votes, and stick to webpack.

Thank you for the suggestion, I learnt something new.