Skip to content

Commit 349322d

Browse files
committed
fix: trim whitespace before !important
1 parent beb2645 commit 349322d

13 files changed

Lines changed: 253 additions & 198 deletions

.changeset/lovely-knives-hang.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@fuzdev/fuz_css': patch
3+
---
4+
5+
fix: trim whitespace before `!important`

src/lib/css_literal.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -172,7 +172,7 @@ export const suggest_modifier = (typo: string): string | null =>
172172
*/
173173
export const format_css_value = (value: string): string => {
174174
let result = value.replace(/~/g, ' ');
175-
result = result.replace(/!important$/, ' !important');
175+
result = result.replace(/\s*!important$/, ' !important');
176176
return result;
177177
};
178178

src/test/css_bundled_resolution.test.ts

Lines changed: 4 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -521,7 +521,7 @@ describe('resolve_css', () => {
521521

522522
assert.isDefined(result.stats);
523523
assert.strictEqual(result.stats.element_count, 1);
524-
assert.include(result.stats.elements as unknown as string, 'button');
524+
assert.include(result.stats.elements, 'button');
525525
assert.isAbove(result.stats.included_rules, 0);
526526
assert.strictEqual(result.stats.total_rules, 3);
527527
assert.strictEqual(result.stats.variable_count, 1);
@@ -553,9 +553,9 @@ describe('resolve_css', () => {
553553
});
554554

555555
assert.strictEqual(result.stats!.element_count, 2);
556-
assert.include(result.stats!.elements as unknown as string, 'button');
557-
assert.include(result.stats!.elements as unknown as string, 'a');
558-
assert.notInclude(result.stats!.elements as unknown as string, 'input');
556+
assert.include(result.stats!.elements, 'button');
557+
assert.include(result.stats!.elements, 'a');
558+
assert.notInclude(result.stats!.elements, 'input');
559559
assert.strictEqual(result.stats!.included_rules, 3); // * + button + a
560560
assert.strictEqual(result.stats!.total_rules, 4);
561561
assert.strictEqual(result.stats!.variable_count, 1);
@@ -735,25 +735,6 @@ describe('resolve_css', () => {
735735
assert.include(result.theme_css, '--color_a');
736736
assert.include(result.theme_css, '--color_b');
737737
});
738-
739-
test('additional_variables: "all" includes all variables', () => {
740-
const {style_rule_index, variable_graph, class_variable_index} = create_test_fixtures(``, [
741-
{name: 'color_a', light: 'blue'},
742-
{name: 'color_b', light: 'green'},
743-
]);
744-
745-
const result = resolve_css({
746-
style_rule_index,
747-
variable_graph,
748-
class_variable_index,
749-
...empty_detection(),
750-
additional_variables: 'all',
751-
});
752-
753-
// With 'all', all variables included
754-
assert.isTrue(result.resolved_variables.has('color_a'));
755-
assert.isTrue(result.resolved_variables.has('color_b'));
756-
});
757738
});
758739

759740
describe('additional_elements and additional_variables combined', () => {

src/test/css_bundled_resolution.variables.test.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -368,7 +368,7 @@ describe('resolve_css variable resolution', () => {
368368
utility_variables_used: new Set(),
369369
});
370370

371-
assert.isAbove(result.diagnostics.length, 0);
371+
assert.strictEqual(result.diagnostics.length, 1);
372372
assert.strictEqual(result.diagnostics[0]!.level, 'warning');
373373
assert.strictEqual(result.diagnostics[0]!.phase, 'generation');
374374
});

src/test/css_class_extractor.locations.test.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -50,10 +50,14 @@ describe('SourceIndex', () => {
5050
const index = new SourceIndex(source);
5151

5252
assert.strictEqual(index.get_location(0, 'f').line, 1); // 'a'
53-
assert.strictEqual(index.get_location(3, 'f').line, 1); // 'c'
53+
assert.strictEqual(index.get_location(0, 'f').column, 1);
54+
assert.strictEqual(index.get_location(3, 'f').line, 1); // '\r'
55+
assert.strictEqual(index.get_location(3, 'f').column, 4);
5456
assert.strictEqual(index.get_location(5, 'f').line, 2); // 'd'
55-
assert.strictEqual(index.get_location(8, 'f').line, 2); // 'f'
57+
assert.strictEqual(index.get_location(5, 'f').column, 1);
58+
assert.strictEqual(index.get_location(8, 'f').line, 2); // '\r'
5659
assert.strictEqual(index.get_location(10, 'f').line, 3); // 'g'
60+
assert.strictEqual(index.get_location(10, 'f').column, 1);
5761
});
5862

5963
test('includes file in location', () => {
@@ -97,7 +101,8 @@ describe('source location tracking', () => {
97101
const locations = result.classes?.get('col-test');
98102
assert.isDefined(locations);
99103
assert.strictEqual(locations[0]!.line, 1);
100-
assert.isAbove(locations[0]!.column, 0);
104+
// 'col-test' starts at column 13: <div class="col-test">
105+
assert.strictEqual(locations[0]!.column, 13);
101106
});
102107
});
103108

src/test/css_class_resolution.test.ts

Lines changed: 23 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ describe('resolve_composes', () => {
2424
test('resolves a single token class', () => {
2525
const result = resolve_composes(['p_lg'], BASE_DEFS, new Set(), new Set(), 'test_class');
2626
assert_resolved_declaration(result, 'padding: var(--space_lg);');
27-
assert.ok(result.ok);
27+
assert.isTrue(result.ok);
2828
assert.strictEqual(result.warnings, null);
2929
});
3030

@@ -133,7 +133,7 @@ describe('resolve_composes', () => {
133133
'test_class',
134134
);
135135

136-
assert.ok(!result.ok);
136+
assert.isFalse(result.ok);
137137
assert.strictEqual(result.error.level, 'error');
138138
assert.include(result.error.message, 'Circular reference detected');
139139
assert.include(result.error.message, expectedMessage);
@@ -150,7 +150,7 @@ describe('resolve_composes', () => {
150150
'test_class',
151151
);
152152

153-
assert.ok(!result.ok);
153+
assert.isFalse(result.ok);
154154
assert.strictEqual(result.error.level, 'error');
155155
assert.include(result.error.message, 'Unknown class "unknown_class" in composes array');
156156
assert.strictEqual(result.error.identifier, 'test_class');
@@ -182,7 +182,7 @@ describe('resolve_composes', () => {
182182
'test_class',
183183
);
184184

185-
assert.ok(!result.ok);
185+
assert.isFalse(result.ok);
186186
assert.strictEqual(result.error.level, 'error');
187187
assert.include(
188188
result.error.message,
@@ -210,7 +210,7 @@ describe('resolve_composes', () => {
210210
test('handles empty composes array', () => {
211211
const result = resolve_composes([], {}, new Set(), new Set(), 'test_class');
212212

213-
assert.ok(result.ok);
213+
assert.isTrue(result.ok);
214214
assert.strictEqual(result.declaration, '');
215215
assert.strictEqual(result.warnings, null);
216216
});
@@ -244,7 +244,7 @@ describe('resolve_composes', () => {
244244
};
245245
const result = resolve_composes(['a'], definitions, new Set(), new Set(), 'test_class');
246246

247-
assert.ok(result.ok);
247+
assert.isTrue(result.ok);
248248
assert.strictEqual(result.declaration, 'color: red; padding: 10px; margin: 10px;');
249249
assert.strictEqual(result.warnings, null);
250250
});
@@ -258,7 +258,7 @@ describe('resolve_composes', () => {
258258
};
259259
const result = resolve_composes(['c'], definitions, new Set(), new Set(), 'test_class');
260260

261-
assert.ok(result.ok);
261+
assert.isTrue(result.ok);
262262
assert.strictEqual(result.declaration, 'font-size: 16px; color: blue; color: green;');
263263
assert.strictEqual(result.warnings, null);
264264
});
@@ -272,7 +272,7 @@ describe('resolve_composes', () => {
272272
};
273273
const result = resolve_composes(['a'], definitions, new Set(), new Set(), 'test_class');
274274

275-
assert.ok(result.ok);
275+
assert.isTrue(result.ok);
276276
assert.strictEqual(result.declaration, 'color: red; padding: 10px;');
277277
assert.strictEqual(result.warnings?.length, 1);
278278
assert.strictEqual(result.warnings?.[0]?.message, 'Class "d" is redundant');
@@ -290,7 +290,7 @@ describe('resolve_composes', () => {
290290
};
291291
const result = resolve_composes(['a'], definitions, new Set(), new Set(), 'test_class');
292292

293-
assert.ok(result.ok);
293+
assert.isTrue(result.ok);
294294
assert.strictEqual(result.declaration, 'color: red; padding: 10px;');
295295
assert.strictEqual(result.warnings?.length, 2);
296296
assert.strictEqual(result.warnings?.[0]?.message, 'Class "d" is redundant');
@@ -304,7 +304,7 @@ describe('resolve_composes', () => {
304304
};
305305
const result = resolve_composes(['dup'], definitions, new Set(), new Set(), 'test_class');
306306

307-
assert.ok(result.ok);
307+
assert.isTrue(result.ok);
308308
assert.strictEqual(result.declaration, 'padding: var(--space_lg);');
309309
assert.strictEqual(result.warnings?.length, 1);
310310
assert.strictEqual(result.warnings?.[0]?.message, 'Class "p_lg" is redundant');
@@ -319,7 +319,7 @@ describe('resolve_composes', () => {
319319
};
320320
const result = resolve_composes(['a'], definitions, new Set(), new Set(), 'test_class');
321321

322-
assert.ok(result.ok);
322+
assert.isTrue(result.ok);
323323
assert.strictEqual(result.declaration, 'color: red; padding: 10px; margin: 10px;');
324324
assert.strictEqual(result.warnings?.length, 1);
325325
assert.strictEqual(result.warnings?.[0]?.message, 'Class "d" is redundant');
@@ -339,7 +339,7 @@ describe('resolve_composes', () => {
339339
'test_class',
340340
);
341341

342-
assert.ok(result.ok);
342+
assert.isTrue(result.ok);
343343
assert.strictEqual(result.declaration, '');
344344
});
345345

@@ -417,7 +417,7 @@ describe('resolve_composes', () => {
417417
'test_class',
418418
);
419419

420-
assert.ok(result.ok);
420+
assert.isTrue(result.ok);
421421
assert.strictEqual(result.declaration, '');
422422
assert.notStrictEqual(result.warnings, null);
423423
assert.include(result.warnings?.[0]?.message, 'empty declaration');
@@ -438,7 +438,7 @@ describe('resolve_composes', () => {
438438
'test_class',
439439
);
440440

441-
assert.ok(!result.ok);
441+
assert.isFalse(result.ok);
442442
assert.include(result.error.message, 'Circular reference detected');
443443
assert.include(result.error.message, 'outer');
444444
});
@@ -473,7 +473,7 @@ describe('resolve_composes', () => {
473473
'test_class',
474474
);
475475

476-
assert.ok(result.ok);
476+
assert.isTrue(result.ok);
477477
assert.strictEqual(result.declaration, '');
478478
assert.notStrictEqual(result.warnings, null);
479479
assert.strictEqual(result.warnings?.[0]?.level, 'warning');
@@ -494,7 +494,7 @@ describe('resolve_composes', () => {
494494
'test_class',
495495
);
496496

497-
assert.ok(result.ok);
497+
assert.isTrue(result.ok);
498498
assert.strictEqual(result.declaration, 'color: red;');
499499
assert.notStrictEqual(result.warnings, null);
500500
assert.strictEqual(result.warnings?.length, 1);
@@ -515,7 +515,7 @@ describe('resolve_composes', () => {
515515
'test_class',
516516
);
517517

518-
assert.ok(result.ok);
518+
assert.isTrue(result.ok);
519519
assert.strictEqual(result.declaration, 'color: red;');
520520
assert.strictEqual(result.warnings?.length, 2);
521521
assert.strictEqual(result.warnings?.[0]?.identifier, 'empty1');
@@ -537,7 +537,7 @@ describe('resolve_composes', () => {
537537
'test_class',
538538
);
539539

540-
assert.ok(!result.ok);
540+
assert.isFalse(result.ok);
541541
assert.include(result.error.message, 'ruleset_class');
542542
});
543543
});
@@ -582,7 +582,7 @@ describe('resolve_composes', () => {
582582
};
583583
const result = resolve_composes(['a'], definitions, new Set(), new Set(), 'test');
584584

585-
assert.ok(result.ok);
585+
assert.isTrue(result.ok);
586586
// f, e, d should appear once despite diamond
587587
assert.strictEqual(count_css_occurrences(result.declaration, 'font-size'), 1);
588588
assert.strictEqual(count_css_occurrences(result.declaration, 'color: blue'), 1);
@@ -600,7 +600,7 @@ describe('resolve_composes', () => {
600600
};
601601
const result = resolve_composes(['top'], definitions, new Set(), new Set(), 'test');
602602

603-
assert.ok(result.ok);
603+
assert.isTrue(result.ok);
604604
// base should only appear once
605605
assert.strictEqual(count_css_occurrences(result.declaration, 'color: red'), 1);
606606
// all branches should be present
@@ -616,7 +616,7 @@ describe('resolve_class_definition', () => {
616616
const def: CssClassDefinitionStatic = {declaration: 'color: red;'};
617617
const result = resolve_class_definition(def, 'test', {});
618618

619-
assert.ok(result.ok);
619+
assert.isTrue(result.ok);
620620
assert.strictEqual(result.declaration, 'color: red;');
621621
assert.strictEqual(result.warnings, null);
622622
});
@@ -631,7 +631,7 @@ describe('resolve_class_definition', () => {
631631
const def: CssClassDefinitionStatic = {declaration: ''};
632632
const result = resolve_class_definition(def, 'test', {});
633633

634-
assert.ok(result.ok);
634+
assert.isTrue(result.ok);
635635
assert.strictEqual(result.declaration, '');
636636
assert.notStrictEqual(result.warnings, null);
637637
assert.include(result.warnings?.[0]?.message, 'empty declaration');
@@ -684,7 +684,7 @@ describe('resolve_class_definition', () => {
684684
};
685685
const result = resolve_class_definition(def, 'test', definitions);
686686

687-
assert.ok(result.ok);
687+
assert.isTrue(result.ok);
688688
assert.strictEqual(result.declaration, 'padding: var(--space_lg);');
689689
assert.notStrictEqual(result.warnings, null);
690690
assert.include(result.warnings?.[0]?.message, 'empty declaration');

0 commit comments

Comments
 (0)