404 for fonts located in node_modules, when imported by an external SASS file on "ng test"

[maximedupre]

Bug Report or Feature Request (mark with an x)

- [x] bug report -> please search issues before submitting
- [ ] feature request

Command (mark with an x)

- [ ] new
- [ ] build
- [ ] serve
- [x] test
- [ ] e2e
- [ ] generate
- [ ] add
- [ ] update
- [ ] lint
- [ ] xi18n
- [ ] run
- [ ] config
- [ ] help
- [ ] version
- [ ] doc

Versions

node --version: v9.5.0 npm --version: v6.4.1 ng --version:

Angular CLI: 7.0.2
Node: 9.5.0
OS: darwin x64
Angular: 7.0.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.10.2
@angular-devkit/build-angular     0.10.2
@angular-devkit/build-optimizer   0.10.2
@angular-devkit/build-webpack     0.10.2
@angular-devkit/core              7.0.2
@angular-devkit/schematics        7.0.2
@angular/cli                      7.0.2
@ngtools/webpack                  7.0.2
@schematics/angular               7.0.2
@schematics/update                0.10.2
rxjs                              6.3.3
typescript                        3.1.3
webpack                           4.19.1

Repro steps

In angular.json

"test": {
    [...]
    "styles": [
        "src/styles.scss"
    ]
}

In src/styles.scss

@import "variables";
@import "node_modules/open-iconic/font/css/open-iconic-bootstrap.scss";

In src/_variables.scss

$icon-font-path: "../node_modules/open-iconic/font/fonts/";

In node_modules/open-iconic/fonts/css/open-iconic-bootstrap.scss

$icon-font-path: '../fonts/' !default;

@font-face {
    font-family: 'Icons';
    src: url('#{$icon-font-path}open-iconic.eot');
    src: url('#{$icon-font-path}open-iconic.eot?#iconic-sm') format('embedded-opentype'), url('#{$icon-font-path}open-iconic.woff') format('woff'), url('#{$icon-font-path}open-iconic.ttf') format('truetype'), url('#{$icon-font-path}open-iconic.svg#iconic-sm') format('svg');
    font-weight: normal;
    font-style: normal;
}

The log given by the failure

In the terminal: 30 10 2018 14:12:13.572:WARN [web-server]: 404: /node_modules/open-iconic/font/fonts/open-iconic.woff

In the browser console: GET http://localhost:9876/node_modules/open-iconic/font/fonts/open-iconic.woff net::ERR_ABORTED 404 (Not Found)

Mention any other details that might be useful

No problem when serving or building the application. The problem only occurs when testing.

[alan-agius4]

I'm sorry, but we can't reproduce the problem following the instructions you provided. Remember that we have a large number of issues to resolve, and have only a limited amount of time to reproduce your issue. Short, explicit instructions make it much more likely we'll be able to reproduce the problem so we can fix it.

If the problem persists, please open a new issue following our submission guidelines.

A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}