---
# System prepended metadata

title: Mass bug template - Remove CSS from the DOM of destroyed components

---

# Mass bug template - Remove CSS from the DOM of destroyed components

## Background

Angular recently introduced a way to remove CSS from the DOM of destroyed components. This is currently, on opt-in bases but it will become the default behaviour by **June 30th 2023**. 

The mentioned target is impacted by this change as some tests inadvertently rely on leaked styles. We ask you to review the failure or resolve any issue ahead of time.


## Action

### Please do one of the following:

1) Forcibly retain the current behaviour by configuring the `REMOVE_STYLES_ON_COMPONENT_DESTROY` injection token to `false`.

```ts
import {REMOVE_STYLES_ON_COMPONENT_DESTROY} from '@angular/platform-browser';
...
providers: [{
  provide: REMOVE_STYLES_ON_COMPONENT_DESTROY,
  useValue: false,
}]
```

1) Set `REMOVE_STYLES_ON_COMPONENT_DESTROY` to `true` and approve the new screenshot.

1) Update the test to not rely on previous styles. 

### Good to know

In some cases configuring the `REMOVE_STYLES_ON_COMPONENT_DESTROY` might not need to be configured in the spec that is causing the leaked style and not necessarily the failing test.

We also observed that in some cases, some tests failed due to the component being bootstrapped in a separate `it` block.

```diff
  it('should be created', () => {
    const comp = bootstrap(HomeComponent);
    expect(comp).toBeTruthy();
  });

  it.async('should return PASSED for page screenshot', async () => {
+   bootstrap(HomeComponent);
    authService.checkAuth();
    expect(await scuba.diffPage('home_component')).toHavePassed();
  });
```

## How you reproduce the test failure:
```
g4 patch -c 511135599
g4 sync
blaze test -c opt //my:target
```
For more information please see: go/angular/remove_destroyed_comp_css

