Add fallback tests based on css pseudo-elements
- Dominant language
- C#
- Stars
- 38.4k
- Forks
- 10.9k
- Avg merge
- 2d 10h
- Merged PRs (30d)
- 281
Description
**Motivation:**
CSS for a popular CDN package [Bootstrap Icons](https://icons.getbootstrap.com/) consists entirely of pseudo-element definitions, such as below:
```
.bi::before {
display: inline-block;
font-family: bootstrap-icons !important;
...
}
```
The current implementation of the ASP.NET fallback tester offers no support for pseudo-elements, because the JavaScript for the tester calls a single-parameter overload of [`getComputedStyle`](https://developer.mozilla.org/en-US/docs/Web/API/Window/getComputedStyle). To test pseudo-elements, we need to pass the name of the the pseudo-element to be tested as a second parameter of `getComputedStyle`.
**Solution:**
We add support for testing pseudo-elements by setting an `asp-fallback-test-pseudo-element` attribute:
...
asp-fallback-test-class="bi"
asp-fallback-test-pseudo-element="before"
...
We then pass the value of the `asp-fallback-test-pseudo-element` as the second parameter to the fallback tester function, which then forwards it to `getComputedStyle`; if no value is specified, we pass `null`.
Contributor guide
Research direction
Locate the ASP.NET fallback tester's JavaScript and its existing fallback tests, then inspect how asp-fallback-test-class is read and how getComputedStyle is called. Add coverage for the asp-fallback-test-pseudo-element attribute and verify both the specified pseudo-element and the no-value case are handled.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css, javascript
- Domain
- testing-qa, web-dev
- Issue type
- Feature
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100