Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
4 changes: 2 additions & 2 deletions src/decuplicate.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@ import type { Coverage, Range } from './parse-coverage.ts'
* - if a duplicate stylesheet enters the room, we add it's ranges to the existing stylesheet's ranges
* - only bytes of deduplicated stylesheets are counted
*/
export function deduplicate_entries(entries: Coverage[]): Map<NonNullable<Coverage['text']>, Pick<Coverage, 'ranges' | 'url'>> {
export function deduplicate_entries(entries: Coverage[]): Map<Coverage['text'], Pick<Coverage, 'ranges' | 'url'>> {
let checked_stylesheets = new Map<string, { url: string; ranges: Range[] }>()

for (let entry of entries) {
let text = entry.text || ''
let text = entry.text
if (checked_stylesheets.has(text)) {
let sheet = checked_stylesheets.get(text)!
let ranges = sheet.ranges
Expand Down
1 change: 0 additions & 1 deletion src/filter-entries.ts
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ export function filter_coverage(coverage: Coverage[], parse_html?: Parser): Cove
let result = []

for (let entry of coverage) {
if (!entry.text) continue
let extension = ext(entry.url).toLowerCase()
if (extension === 'js') continue

Expand Down
4 changes: 2 additions & 2 deletions src/index.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ test.describe('from <style> tag', () => {
</body>
</html>
`
coverage = await generate_coverage(html)
coverage = (await generate_coverage(html)) as Coverage[]
})

test('counts totals', () => {
Expand Down Expand Up @@ -86,7 +86,7 @@ test.describe('from <link rel="stylesheet">', () => {
</body>
</html>
`
coverage = await generate_coverage(html, { link_css: css })
coverage = (await generate_coverage(html, { link_css: css })) as Coverage[]
})

test('counts totals', () => {
Expand Down
42 changes: 42 additions & 0 deletions src/kitchen-sink.test.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
import { test, expect } from '@playwright/test'
import { calculate_coverage } from '.'
import { DOMParser } from 'linkedom'

function parse_html(html: string) {
return new DOMParser().parseFromString(html, 'text/html')
}

test('proejctw wallace Container', () => {
const coverage = [
{
url: 'http://localhost:4173/_app/immutable/assets/Container.n-2BXq6O.css',
text: '.container.svelte-1ginl5v{margin-inline:auto;padding-inline:var(--space-2)}@media (min-width: 44rem){.container.svelte-1ginl5v{padding-inline:var(--space-4)}}@media (min-width: 66rem){.container.svelte-1ginl5v{padding-inline:var(--space-8)}}.size-auto.svelte-1ginl5v{max-width:120rem}.size-sm.svelte-1ginl5v{max-width:28rem}.size-md.svelte-1ginl5v{max-width:32rem}.size-lg.svelte-1ginl5v{max-width:36rem}.size-xl.svelte-1ginl5v{max-width:48rem}.size-2xl.svelte-1ginl5v{max-width:64rem}.size-3xl.svelte-1ginl5v{max-width:80rem}\n',
ranges: [
{ start: 0, end: 75 },
{ start: 82, end: 157 },
{ start: 165, end: 240 },
{ start: 241, end: 284 },
{ start: 485, end: 526 },
],
},
]
let result = calculate_coverage(coverage, parse_html)
let sheet = result.coverage_per_stylesheet.at(0)!

expect.soft(sheet.total_lines).toBe(44)
expect.soft(sheet.chunks).toHaveLength(3)

let [chunk1, chunk2, chunk3] = sheet.chunks

expect.soft(chunk1?.start_line).toEqual(1)
expect.soft(chunk1?.end_line).toEqual(21)
expect.soft(chunk1?.total_lines).toEqual(21)

expect.soft(chunk2?.start_line).toEqual(22)
expect.soft(chunk2?.end_line).toEqual(40)
expect.soft(chunk2?.total_lines).toEqual(19)

expect.soft(chunk3?.start_line).toEqual(41)
expect.soft(chunk3?.end_line).toEqual(44)
expect.soft(chunk3?.total_lines).toEqual(4)
})
9 changes: 2 additions & 7 deletions src/parse-coverage.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ test('parses valid JSON', () => {
])
})

test('allows entries without text', () => {
test('does not allow entries without text', () => {
let input = `
[
{
Expand All @@ -35,12 +35,7 @@ test('allows entries without text', () => {
]
`
let result = parse_coverage(input)
expect(result).toEqual([
{
url: 'example.com',
ranges: [{ start: 0, end: 13 }],
},
])
expect(result).toEqual([])
})

test('returns empty array for invalid JSON', () => {
Expand Down
35 changes: 13 additions & 22 deletions src/parse-coverage.ts
Original file line number Diff line number Diff line change
@@ -1,31 +1,22 @@
import * as v from 'valibot'

export type Range = {
start: number
end: number
}
let RangeSchema = v.object({
start: v.number(),
end: v.number(),
})

export type Coverage = {
url: string
text?: string
ranges: Range[]
}
export type Range = v.InferInput<typeof RangeSchema>

let CoverageSchema = v.object({
text: v.string(),
url: v.string(),
ranges: v.array(RangeSchema),
})

let CoverageSchema = v.array(
v.object({
text: v.optional(v.string()),
url: v.string(),
ranges: v.array(
v.object({
start: v.number(),
end: v.number(),
}),
),
}),
)
export type Coverage = v.InferInput<typeof CoverageSchema>

export function is_valid_coverage(input: unknown): boolean {
let result = v.safeParse(CoverageSchema, input)
let result = v.safeParse(v.array(CoverageSchema), input)
return result.success
}

Expand Down
18 changes: 18 additions & 0 deletions src/prettify.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -54,3 +54,21 @@ test('atrule prettification', () => {
]
expect(prettify(entries)).toEqual(prettified)
})

test('prettify url()', () => {
let entries = [
{
url: 'example.com',
text: `a{ background-image: "example.com/test.gif"; background-image: url('example.com/test.jpg'); background-image: url("example.com/test.png"); }`,
ranges: [{ start: 0, end: 140 }],
},
]
let prettified = [
{
url: 'example.com',
text: `a {\n\tbackground-image: "example.com/test.gif";\n\tbackground-image: url("example.com/test.jpg");\n\tbackground-image: url("example.com/test.png");\n}`,
ranges: [{ start: 0, end: 151 - 7 }],
},
]
expect(prettify(entries)).toEqual(prettified)
})
14 changes: 0 additions & 14 deletions src/prettify.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,6 @@ import { tokenize, tokenTypes } from 'css-tree/tokenizer'

export function prettify(coverage: Coverage[]): Coverage[] {
return coverage.map(({ url, text, ranges }) => {
if (!text) {
return { url, text, ranges }
}
let formatted = format(text)
let irrelevant_tokens: Set<number> = new Set([
tokenTypes.EOF,
Expand Down Expand Up @@ -40,11 +37,6 @@ export function prettify(coverage: Coverage[]): Coverage[] {
if (irrelevant_tokens.has(type)) return
index++

// format-css changes the Url token to a Function,String,RightParenthesis token sequence
if (type === tokenTypes.Url) {
index += 2
}

let range_index = is_in_range(start, end)
if (range_index !== -1) {
ext_ranges[range_index]!.tokens.push(index)
Expand All @@ -57,12 +49,6 @@ export function prettify(coverage: Coverage[]): Coverage[] {
tokenize(formatted, (type, start, end) => {
if (irrelevant_tokens.has(type)) return
index++

// format-css changes the Url token to a Function,String,RightParenthesis token sequence
if (type === tokenTypes.Url) {
index += 2
}

new_tokens.set(index, { start, end })
})

Expand Down