Skip to content

Commit 3527fe3

Browse files
mgechevmgechev
authored
Merge pull request #404 from mgechev/minko/dir-selector
test: add spec for directive selector prefix
2 parents 5c460be + 656d4ff commit 3527fe3

File tree

1 file changed

+137
-127
lines changed

1 file changed

+137
-127
lines changed

‎test/directiveSelectorRule.spec.ts‎

Lines changed: 137 additions & 127 deletions
Original file line numberDiff line numberDiff line change
@@ -1,220 +1,230 @@
11
import { assertAnnotated, assertSuccess } from './testHelper';
22

33
describe('directive-selector-name', () => {
4-
describe('invalid directive selectors', () => {
5-
it('should fail when directive named kebab-case', () => {
6-
let source = `
4+
describe('invalid directive selectors', () => {
5+
it('should fail when directive named kebab-case', () => {
6+
let source = `
77
@Directive({
88
selector: '[sg-foo-bar]'
99
~~~~~~~~~~~~~~
1010
})
1111
class Test {}`;
12-
assertAnnotated({
13-
ruleName: 'directive-selector',
14-
message: 'The selector of the directive "Test" should be named camelCase (https://angular.io/styleguide#style-02-06)',
15-
source,
16-
options: ['attribute', 'sg', 'camelCase']
17-
});
18-
});
19-
});
20-
describe('valid directive selector, using multiple selectors', () => {
21-
it('should succeed when set valid selector in @Directive', () => {
22-
let source = `
12+
assertAnnotated({
13+
ruleName: 'directive-selector',
14+
message: 'The selector of the directive "Test" should be named camelCase (https://angular.io/styleguide#style-02-06)',
15+
source,
16+
options: ['attribute', 'sg', 'camelCase']
17+
});
18+
});
19+
});
20+
describe('valid directive selector, using multiple selectors', () => {
21+
it('should succeed when set valid selector in @Directive', () => {
22+
let source = `
2323
@Directive({
2424
selector: 'test[sgBarFoo].test:not(p)'
2525
})
2626
class Test {}`;
27-
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
28-
});
27+
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
2928
});
30-
describe('valid directive selector, using multiple selectors, element type and kebap-case', () => {
31-
it('should succeed when set valid selector in @Directive', () => {
32-
let source = `
29+
});
30+
describe('valid directive selector, using multiple selectors, element type and kebap-case', () => {
31+
it('should succeed when set valid selector in @Directive', () => {
32+
let source = `
3333
@Directive({
3434
selector: 'sg-bar-foo[test].test:not(p)'
3535
})
3636
class Test {}`;
37-
assertSuccess('directive-selector', source, ['element', 'sg', 'kebab-case']);
38-
});
37+
assertSuccess('directive-selector', source, ['element', 'sg', 'kebab-case']);
3938
});
40-
describe('invalid directive selector, using multiple selectors', () => {
41-
it('should succeed when set valid selector in @Directive and multiple selectors', () => {
42-
let source = `
39+
});
40+
describe('invalid directive selector, using multiple selectors', () => {
41+
it('should succeed when set valid selector in @Directive and multiple selectors', () => {
42+
let source = `
4343
@Directive({
4444
selector: 'test[sg-bar-foo].test:not(p)'
4545
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
4646
})
4747
class Test {}`;
48-
assertAnnotated({
49-
ruleName: 'directive-selector',
50-
message: 'The selector of the directive "Test" should be named camelCase (https://angular.io/styleguide#style-02-06)',
51-
source,
52-
options: ['attribute', 'sg', 'camelCase']
53-
});
54-
});
48+
assertAnnotated({
49+
ruleName: 'directive-selector',
50+
message: 'The selector of the directive "Test" should be named camelCase (https://angular.io/styleguide#style-02-06)',
51+
source,
52+
options: ['attribute', 'sg', 'camelCase']
53+
});
5554
});
55+
});
5656
});
5757
describe('directive-selector-prefix', () => {
58-
describe('invalid directive selectors', () => {
59-
it('should fail when directive used without prefix', () => {
60-
let source = `
58+
describe('invalid directive selectors', () => {
59+
it('should fail when directive used without prefix', () => {
60+
let source = `
6161
@Directive({
6262
selector: '[fooBar]'
6363
~~~~~~~~~~
6464
})
6565
class Test {}`;
66-
assertAnnotated({
67-
ruleName: 'directive-selector',
68-
message: 'The selector of the directive "Test" should have prefix "sg" (https://angular.io/styleguide#style-02-08)',
69-
source,
70-
options: ['attribute', 'sg', 'camelCase']
71-
});
72-
});
66+
assertAnnotated({
67+
ruleName: 'directive-selector',
68+
message: 'The selector of the directive "Test" should have prefix "sg" (https://angular.io/styleguide#style-02-08)',
69+
source,
70+
options: ['attribute', 'sg', 'camelCase']
71+
});
72+
});
7373

74-
it('should fail when directive used without longer prefix', () => {
75-
let source = `
74+
it('should fail when directive used without longer prefix', () => {
75+
let source = `
7676
@Directive({
7777
selector: '[fooBar]'
7878
~~~~~~~~~~
7979
})
8080
class Test {}`;
81-
assertAnnotated({
82-
ruleName: 'directive-selector',
83-
message: 'The selector of the directive "Test" should have prefix "fo" (https://angular.io/styleguide#style-02-08)',
84-
source,
85-
options: ['attribute', 'fo', 'camelCase']
86-
});
87-
});
81+
assertAnnotated({
82+
ruleName: 'directive-selector',
83+
message: 'The selector of the directive "Test" should have prefix "fo" (https://angular.io/styleguide#style-02-08)',
84+
source,
85+
options: ['attribute', 'fo', 'camelCase']
86+
});
87+
});
8888

89-
it('should fail when directive used without prefix applying multiple prefixes', () => {
90-
let source = `
89+
it('should fail when directive used without prefix applying multiple prefixes', () => {
90+
let source = `
9191
@Directive({
9292
selector: '[fooBar]'
9393
~~~~~~~~~~
9494
})
9595
class Test {}`;
96-
assertAnnotated({
97-
ruleName: 'directive-selector',
98-
message: 'The selector of the directive "Test" should have one of the prefixes "sg, ng, mg"' +
99-
' (https://angular.io/styleguide#style-02-08)',
100-
source,
101-
options: ['attribute', ['sg', 'ng', 'mg'], 'camelCase']
102-
});
103-
});
104-
it('should fail when directive used without prefix applying multiple prefixes and selectors', () => {
105-
let source = `
96+
assertAnnotated({
97+
ruleName: 'directive-selector',
98+
message: 'The selector of the directive "Test" should have one of the prefixes "sg, ng, mg"' +
99+
' (https://angular.io/styleguide#style-02-08)',
100+
source,
101+
options: ['attribute', ['sg', 'ng', 'mg'], 'camelCase']
102+
});
103+
});
104+
it('should fail when directive used without prefix applying multiple prefixes and selectors', () => {
105+
let source = `
106106
@Directive({
107107
selector: 'baz.bar[fooBar]'
108108
~~~~~~~~~~~~~~~~~
109109
})
110110
class Test {}`;
111-
assertAnnotated({
112-
ruleName: 'directive-selector',
113-
message: 'The selector of the directive "Test" should have one of the prefixes "sg, ng, mg"' +
114-
' (https://angular.io/styleguide#style-02-08)',
115-
source,
116-
options: ['attribute', ['sg', 'ng', 'mg'], 'camelCase']
117-
});
118-
});
119-
});
120-
describe('valid directive selector', () => {
121-
it('should succeed when set valid selector in @Directive', () => {
122-
let source = `
111+
assertAnnotated({
112+
ruleName: 'directive-selector',
113+
message: 'The selector of the directive "Test" should have one of the prefixes "sg, ng, mg"' +
114+
' (https://angular.io/styleguide#style-02-08)',
115+
source,
116+
options: ['attribute', ['sg', 'ng', 'mg'], 'camelCase']
117+
});
118+
});
119+
});
120+
describe('valid directive selector', () => {
121+
it('should succeed when set valid selector in @Directive', () => {
122+
let source = `
123123
@Directive({
124124
selector: '[sgBarFoo]'
125125
})
126126
class Test {}`;
127-
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
128-
});
127+
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
128+
});
129129

130-
it('should succeed when set valid selector in @Directive', () => {
131-
let source = `
130+
it('should succeed when set valid selector in @Directive', () => {
131+
let source = `
132132
@Directive({
133133
selector: 'sgBarFoo'
134134
})
135135
class Test {}`;
136-
assertSuccess('directive-selector', source, [['attribute', 'element'], 'sg', 'camelCase']);
137-
});
136+
assertSuccess('directive-selector', source, [['attribute', 'element'], 'sg', 'camelCase']);
137+
});
138138

139-
it('should succeed when set valid selector in @Directive using multiple prefixes', () => {
140-
let source = `
139+
it('should work with valid selector', () => {
140+
const source = `
141+
@Directive({
142+
selector: 'button[xcButton]'
143+
})
144+
class Test {}
145+
`;
146+
assertSuccess('directive-selector', source, ['attribute', 'xc', 'camelCase']);
147+
});
148+
149+
it('should succeed when set valid selector in @Directive using multiple prefixes', () => {
150+
let source = `
141151
@Directive({
142152
selector: '[ngBarFoo]'
143153
})
144154
class Test {}`;
145-
assertSuccess('directive-selector', source, ['attribute', ['ng', 'sg', 'mg'], 'camelCase']);
146-
});
147-
it('should succeed when set valid selector in @Directive using multiple prefixes and selectors', () => {
148-
let source = `
155+
assertSuccess('directive-selector', source, ['attribute', ['ng', 'sg', 'mg'], 'camelCase']);
156+
});
157+
it('should succeed when set valid selector in @Directive using multiple prefixes and selectors', () => {
158+
let source = `
149159
@Directive({
150160
selector: 'bar[ngBarFoo].baz'
151161
})
152162
class Test {}`;
153-
assertSuccess('directive-selector', source, ['attribute', ['ng', 'sg', 'mg'], 'camelCase']);
154-
});
163+
assertSuccess('directive-selector', source, ['attribute', ['ng', 'sg', 'mg'], 'camelCase']);
155164
});
165+
});
156166
});
157167
describe('directive-selector-type', () => {
158-
describe('invalid directive selectors', () => {
159-
it('should fail when directive used as attribute', () => {
160-
let source = `
168+
describe('invalid directive selectors', () => {
169+
it('should fail when directive used as attribute', () => {
170+
let source = `
161171
@Directive({
162172
selector: 'foo-bar'
163173
~~~~~~~~~
164174
})
165175
class Test {}`;
166-
assertAnnotated({
167-
ruleName: 'directive-selector',
168-
message: 'The selector of the directive "Test" should be used as attribute (https://angular.io/styleguide#style-02-06)',
169-
source,
170-
options: ['attribute', 'sg', 'camelCase']
171-
});
172-
});
173-
});
174-
describe('invalid directive selector, using multiple selectors', () => {
175-
it('should fail when set non attribute selectors in @Directive', () => {
176-
let source = `
176+
assertAnnotated({
177+
ruleName: 'directive-selector',
178+
message: 'The selector of the directive "Test" should be used as attribute (https://angular.io/styleguide#style-02-06)',
179+
source,
180+
options: ['attribute', 'sg', 'camelCase']
181+
});
182+
});
183+
});
184+
describe('invalid directive selector, using multiple selectors', () => {
185+
it('should fail when set non attribute selectors in @Directive', () => {
186+
let source = `
177187
@Directive({
178188
selector: 'test.test:not(p)'
179189
~~~~~~~~~~~~~~~~~~
180190
})
181191
class Test {}`;
182-
assertAnnotated({
183-
ruleName: 'directive-selector',
184-
message: 'The selector of the directive "Test" should be used as attribute (https://angular.io/styleguide#style-02-06)',
185-
source,
186-
options: ['attribute', 'sg', 'camelCase']
187-
});
188-
});
189-
});
190-
describe('valid directive selector', () => {
191-
it('should succeed when set valid selector in @Directive', () => {
192-
let source = `
192+
assertAnnotated({
193+
ruleName: 'directive-selector',
194+
message: 'The selector of the directive "Test" should be used as attribute (https://angular.io/styleguide#style-02-06)',
195+
source,
196+
options: ['attribute', 'sg', 'camelCase']
197+
});
198+
});
199+
});
200+
describe('valid directive selector', () => {
201+
it('should succeed when set valid selector in @Directive', () => {
202+
let source = `
193203
@Directive({
194204
selector: '[sgBarFoo]'
195205
})
196206
class Test {}`;
197-
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
198-
});
199-
it('should not validate @Component', () => {
200-
let source = `
207+
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
208+
});
209+
it('should not validate @Component', () => {
210+
let source = `
201211
@Component({
202212
selector: 'sg-bar-foo'
203213
})
204214
class Test {}`;
205-
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
206-
});
207-
it('should succeed when set valid selector using multiple selectors in @Directive', () => {
208-
let source = `
215+
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
216+
});
217+
it('should succeed when set valid selector using multiple selectors in @Directive', () => {
218+
let source = `
209219
@Directive({
210220
selector: 'baz[sgBarFoo].bai'
211221
})
212222
class Test {}`;
213-
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
214-
});
223+
assertSuccess('directive-selector', source, ['attribute', 'sg', 'camelCase']);
224+
});
215225

216-
it('should succeed when set valid selector using multiple selectors in @Directive', () => {
217-
let source = `
226+
it('should succeed when set valid selector using multiple selectors in @Directive', () => {
227+
let source = `
218228
@Directive({
219229
selector: '[past][formControlName],[past][formControl],[past][ngModel]',
220230
providers: [{
@@ -225,7 +235,7 @@ describe('directive-selector-type', () => {
225235
host: {'[attr.date]': 'date? "" : null'},
226236
})
227237
class Test {}`;
228-
assertSuccess('directive-selector', source, ['attribute', 'ng', 'camelCase']);
229-
});
238+
assertSuccess('directive-selector', source, ['attribute', 'ng', 'camelCase']);
230239
});
240+
});
231241
});

0 commit comments

Comments
 (0)