question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. ItΒ collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Ternary operator in styleUrls doesn't work in UnitTests

See original GitHub issue

🐞 Bug report

Command (mark with an x)

  • test

Is this a regression?

no

Description

When I use ternary operator in styleUrls e.g. ` styleUrls: [environment.production ? β€˜./app.component.prod.css’ : β€˜./app.component.css’] the application works fine but in Unit Tests no one style is compiled. Compiled component with ternary operator: image

Compiled component without ternary operator: image

looks like the JIT compiler doesn’t work properly with it. `

A clear and concise description of the problem...

πŸ”¬ Minimal Reproduction

I created a repo where you can reproduce it:https://github.com/VlasovSergey/ternary-operator-styleUrls

  1. run β€˜ng test’ test will fail because value of textAlign is not expected though it is set in both style files.

🌍 Your Environment


Angular CLI: 12.1.1
Node: 14.17.2
Package Manager: npm 6.14.13
OS: win32 x64

Angular: 12.1.1
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1201.1
@angular-devkit/build-angular   12.1.1
@angular-devkit/core            12.1.1
@angular-devkit/schematics      12.1.1
@schematics/angular             12.1.1
rxjs                            6.6.7
typescript                      4.3.5

Anything else relevant?

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

2reactions
alan-agius4commented, Jul 13, 2021

This is currently working as expected for JIT mode. Hence, I am marking this as a feature request.

1reaction
alan-agius4commented, Mar 3, 2022

Hi @VlasovSergey.

Thanks for this feature request, However, currently this not in the Angular CLI roadmap.

Let’s re-consider in the future if there is more interest from the community.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to test a ternary operator with Jest in Angular
I see 2 ways of doing this : Use the !! syntax in the html template. You want to replace the property with...
Read more >
condition for load styleUrls in component angular-angular.js
You can use a ternary operator inside: const url1 = './foo.css'; const url2 = './bar.css'; let condition = true @Component({ selector: 'app-root',Β ...
Read more >
Component testing scenarios - Angular
Error: This test module uses the component BannerComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Please call "TestBed....
Read more >
unit testing components with styleUrls fails #4873 - GitHub
It looks like when I try to run a test on a component that has styleUrls: @Component({ selector: 'glyph', encapsulation: ViewEncapsulation.
Read more >
Code coverage testing, when enough is enough - JS.dev
Each nested ternary operator adds an additional outcome. These are all registered as branches and must be validated through unit tests. ForΒ ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found