@@ -6,7 +6,7 @@ const ruleOptions = {}
6
6
ruleOptions [ ruleId ] = true
7
7
8
8
describe ( `Rules: ${ ruleId } ` , ( ) => {
9
- it ( 'Attribute unsorted tags must result in an error' , ( ) => {
9
+ it ( 'Unsorted defined attributes should throw error' , ( ) => {
10
10
const code = '<div id="test" class="class" title="title"></div>'
11
11
12
12
const messages = HTMLHint . verify ( code , ruleOptions )
@@ -16,45 +16,101 @@ describe(`Rules: ${ruleId}`, () => {
16
16
expect ( messages [ 0 ] . message ) . toContain ( '["id","class","title"]' )
17
17
} )
18
18
19
- it ( 'Attribute sorted tags that are unrecognizable should not throw error' , ( ) => {
20
- const code = '<div font="font" img="image" meta="meta "></div>'
19
+ it ( 'Sorted defined attributes should not throw error' , ( ) => {
20
+ const code = '<div class="class" id="test" title="title "></div>'
21
21
22
22
const messages = HTMLHint . verify ( code , ruleOptions )
23
23
24
24
expect ( messages . length ) . toBe ( 0 )
25
25
} )
26
26
27
- it ( 'Attribute unsorted tags that are unrecognizable should throw error' , ( ) => {
28
- const code = '<div img="image" meta="meta" font="font" ></div >'
27
+ it ( 'Unsorted data-* attributes should throw error' , ( ) => {
28
+ const code = '<main data-b="foo" data-a="bar" ></main >'
29
29
30
30
const messages = HTMLHint . verify ( code , ruleOptions )
31
31
32
32
expect ( messages . length ) . toBe ( 1 )
33
33
expect ( messages [ 0 ] . rule . id ) . toBe ( ruleId )
34
- expect ( messages [ 0 ] . message ) . toContain ( '["img ","meta","font "]' )
34
+ expect ( messages [ 0 ] . message ) . toContain ( '["data-a ","data-b "]' )
35
35
} )
36
36
37
- it ( 'Attribute unsorted of tags of various types should throw error' , ( ) => {
38
- const code = '<div type="type" img="image" id="id" font="font"></div>'
37
+ it ( 'Sorted data-* attributes should not throw error' , ( ) => {
38
+ const code = '<main data-a="bar" data-b="foo"></main>'
39
+
40
+ const messages = HTMLHint . verify ( code , ruleOptions )
41
+
42
+ expect ( messages . length ) . toBe ( 0 )
43
+ } )
44
+
45
+ it ( 'Unsorted lambda attributes should throw error' , ( ) => {
46
+ const code = '<button disabled dir="rtl">Click</button>'
47
+
48
+ const messages = HTMLHint . verify ( code , ruleOptions )
49
+
50
+ expect ( messages . length ) . toBe ( 1 )
51
+ expect ( messages [ 0 ] . rule . id ) . toBe ( ruleId )
52
+ expect ( messages [ 0 ] . message ) . toContain ( '["dir","disabled"]' )
53
+ } )
54
+
55
+ it ( 'Sorted lambda attributes should not throw error' , ( ) => {
56
+ const code = '<button dir="rtl" disabled>Click</button>'
57
+
58
+ const messages = HTMLHint . verify ( code , ruleOptions )
59
+
60
+ expect ( messages . length ) . toBe ( 0 )
61
+ } )
62
+
63
+ it ( 'Unsorted defined and data-* attributes should throw error' , ( ) => {
64
+ const code = '<img data-focal="80" src="IMG.jpg" />'
65
+
66
+ const messages = HTMLHint . verify ( code , ruleOptions )
67
+
68
+ expect ( messages . length ) . toBe ( 1 )
69
+ expect ( messages [ 0 ] . rule . id ) . toBe ( ruleId )
70
+ expect ( messages [ 0 ] . message ) . toContain ( '["src","data-focal"]' )
71
+ } )
72
+
73
+ it ( 'Sorted defined and data-* attributes should not throw error' , ( ) => {
74
+ const code = '<img src="IMG.jpg" data-focal="80" />'
75
+
76
+ const messages = HTMLHint . verify ( code , ruleOptions )
77
+
78
+ expect ( messages . length ) . toBe ( 0 )
79
+ } )
80
+
81
+ it ( 'Unsorted defined and lambda attributes should throw error' , ( ) => {
82
+ const code = '<input required value="foo" />'
39
83
40
84
const messages = HTMLHint . verify ( code , ruleOptions )
41
85
42
86
expect ( messages . length ) . toBe ( 1 )
43
87
expect ( messages [ 0 ] . rule . id ) . toBe ( ruleId )
44
- expect ( messages [ 0 ] . message ) . toContain ( '["type ","img","id","font "]' )
88
+ expect ( messages [ 0 ] . message ) . toContain ( '["value ","required "]' )
45
89
} )
46
90
47
- it ( 'link tag with rel before href should not throw error' , ( ) => {
48
- const code = '<link rel="stylesheet" href="https://example.com/style.css">'
91
+ it ( 'Sorted defined and lambda attributes should not throw error' , ( ) => {
92
+ const code = '<input value="foo" required />'
93
+
49
94
const messages = HTMLHint . verify ( code , ruleOptions )
95
+
50
96
expect ( messages . length ) . toBe ( 0 )
51
97
} )
52
98
53
- it ( 'link tag with href before rel should throw error' , ( ) => {
54
- const code = '<link href="https://example.com/style.css" rel="stylesheet">'
99
+ it ( 'Unsorted data-* and lambda attributes should throw error' , ( ) => {
100
+ const code = '<section data-prop="abc" lang="en" />'
101
+
55
102
const messages = HTMLHint . verify ( code , ruleOptions )
103
+
56
104
expect ( messages . length ) . toBe ( 1 )
57
105
expect ( messages [ 0 ] . rule . id ) . toBe ( ruleId )
58
- expect ( messages [ 0 ] . message ) . toContain ( '["href","rel"]' )
106
+ expect ( messages [ 0 ] . message ) . toContain ( '["lang","data-prop"]' )
107
+ } )
108
+
109
+ it ( 'Sorted data-* and lambda attributes should not throw error' , ( ) => {
110
+ const code = '<section lang="en" data-prop="abc" />'
111
+
112
+ const messages = HTMLHint . verify ( code , ruleOptions )
113
+
114
+ expect ( messages . length ) . toBe ( 0 )
59
115
} )
60
116
} )
0 commit comments