Skip to content

perf: upgrade css-code-coverage to 0.6.0 #39

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
bartveneman merged 4 commits into from
Oct 24, 2025
Merged

perf: upgrade css-code-coverage to 0.6.0 #39

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
4a19f24
checkpoint
bartveneman Oct 24, 2025
560660d
upgrade css-code-coverage to 0.6.0
bartveneman Oct 24, 2025
197ed4e
npm audit fix
bartveneman Oct 24, 2025
5c212a4
fix coverage tests
bartveneman Oct 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion content/blog/2025-07-05-how-to-naked-css.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ So this post shows you how to make your website look naked in just 7 lines of co

4. Bonus: hide inaccessible content

I'm hiding all elements that have `aria-hidden="true"` because they are only useful visually, not for assisitve technology. So that's why it makes sense for me to hide these elements just to check how I navigate the website without them.
I'm hiding all elements that have `aria-hidden="true"` because they are only useful visually, not for assistive technology. So that's why it makes sense for me to hide these elements just to check how I navigate the website without them.

```css
[data-theme="naked"] {
Expand Down
61 changes: 30 additions & 31 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
"@melt-ui/svelte": "^0.86.6",
"@oddbird/popover-polyfill": "^0.6.1",
"@projectwallace/css-analyzer": "^7.6.0",
"@projectwallace/css-code-coverage": "^0.5.0",
"@projectwallace/css-code-coverage": "^0.6.0",
"@projectwallace/css-code-quality": "^3.0.2",
"@projectwallace/css-design-tokens": "^0.6.0",
"@projectwallace/css-layer-tree": "^2.0.0",
Expand Down
28 changes: 15 additions & 13 deletions src/lib/components/Pre.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -184,19 +184,21 @@
<div class="window">
{#if show_coverage}
{@const uncovered_blocks_count = coverage_chunks.filter((c) => !c.is_covered).length}
<div class="toolbar">
<p>
{uncovered_blocks_count} un-covered {uncovered_blocks_count === 1 ? 'block' : 'blocks'}
</p>
<button type="button" onclick={jump_to_previous_uncovered} title="Go to the previous un-covered block">
<span class="sr-only">Go to the previous un-covered block</span>
<Icon name="chevron-up" size={12} />
</button>
<button type="button" onclick={jump_to_next_uncovered} title="Go to the next un-covered block">
<span class="sr-only">Go to the next un-covered block</span>
<Icon name="chevron-down" size={12} />
</button>
</div>
{#if uncovered_blocks_count > 0}
<div class="toolbar">
<p>
{uncovered_blocks_count} un-covered {uncovered_blocks_count === 1 ? 'block' : 'blocks'}
</p>
<button type="button" onclick={jump_to_previous_uncovered} title="Go to the previous un-covered block">
<span class="sr-only">Go to the previous un-covered block</span>
<Icon name="chevron-up" size={12} />
</button>
<button type="button" onclick={jump_to_next_uncovered} title="Go to the next un-covered block">
<span class="sr-only">Go to the next un-covered block</span>
<Icon name="chevron-down" size={12} />
</button>
</div>
{/if}
{/if}
<div
bind:this={body}
Expand Down
16 changes: 2 additions & 14 deletions src/lib/components/coverage/Coverage.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,9 +55,9 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/0.BBE7cspC.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('38 kB')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('37.5 kB')
await expect.soft(first_row.getByRole('cell').nth(2)).toHaveAccessibleName('2,619')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('72.28%')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('75.37%')

// Elements in correct state:
await expect.soft(table.getByRole('row').nth(1)).toHaveAttribute('aria-selected', 'true')
Expand Down Expand Up @@ -96,8 +96,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/Textarea.D3Oc5lUl.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('238 B')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('100%')
let css_content = await page.getByTestId('pre-css').textContent()
expect.soft(css_content).toContain('textarea.svelte-g7hyhb {')

Expand All @@ -108,8 +106,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/0.BBE7cspC.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('38 kB')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('72.28%')
})

test('sorting by total size', async ({ page }) => {
Expand All @@ -122,8 +118,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/0.BBE7cspC.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('38 kB')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('72.28%')
let css_content = await page.getByTestId('pre-css').textContent()
expect.soft(css_content).toContain('.logo.svelte-1jiwtxp {')

Expand All @@ -134,8 +128,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/FormattedDate.JHv9Zh3p.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('69 B')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('100%')
css_content = await page.getByTestId('pre-css').textContent()
expect.soft(css_content).toContain('time.svelte-60ldmz {')
})
Expand All @@ -150,8 +142,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/23.lTvFD_l9.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('405 B')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('100%')
let css_content = await page.getByTestId('pre-css').textContent()
expect.soft(css_content).toContain('.form.svelte-148ca8f {')

Expand All @@ -162,8 +152,6 @@ test.describe('loading example file', () => {
await expect
.soft(first_row.getByRole('cell').nth(0))
.toHaveAccessibleName('https://www.projectwallace.com/_app/immutable/assets/25.C4edrrKC.css')
await expect.soft(first_row.getByRole('cell').nth(1)).toHaveAccessibleName('780 B')
await expect.soft(first_row.getByRole('cell').nth(3)).toHaveAccessibleName('0%')
css_content = await page.getByTestId('pre-css').textContent()
expect.soft(css_content).toContain('.page.svelte-1b1m7j9 {')
})
Expand Down
4 changes: 2 additions & 2 deletions src/lib/components/coverage/Coverage.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -128,12 +128,12 @@
</div>
<div>
<dt>Used</dt>
<dd>{format_filesize(calculated.used_bytes)}</dd>
<dd>{format_filesize(calculated.covered_bytes)}</dd>
<dd>{format_number(calculated.covered_lines)} lines</dd>
</div>
<div>
<dt>Unused</dt>
<dd>{format_filesize(calculated.unused_bytes)}</dd>
<dd>{format_filesize(calculated.uncovered_bytes)}</dd>
<dd>{format_number(calculated.uncovered_lines)} lines</dd>
</div>
</div>
Expand Down
Loading