-
-
Notifications
You must be signed in to change notification settings - Fork 1.7k
Expand file tree
/
Copy pathindex.spec.ts
More file actions
118 lines (101 loc) · 3.79 KB
/
index.spec.ts
File metadata and controls
118 lines (101 loc) · 3.79 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
import { MediaQueryType, matchQuery, parseQuery } from '.';
describe('css-mediaquery', () => {
describe('parseQuery', () => {
it('should parse media queries without expressions', () => {
expect(parseQuery('screen')).toEqual([
{
inverse: false,
type: MediaQueryType.screen,
features: [],
},
]);
expect(parseQuery('not screen')).toEqual([
{
inverse: true,
type: MediaQueryType.screen,
features: [],
},
]);
});
it('should throw a SyntaxError when a media query is invalid', () => {
expect(() => parseQuery('some crap')).toThrow(SyntaxError);
expect(() => parseQuery('48em')).toThrow(SyntaxError);
expect(() => parseQuery('screen and crap')).toThrow(SyntaxError);
expect(() => parseQuery('screen and (48em)')).toThrow(SyntaxError);
expect(() => parseQuery('screen and (foo:)')).toThrow(SyntaxError);
expect(() => parseQuery('()')).toThrow(SyntaxError);
expect(() => parseQuery('(foo) (bar)')).toThrow(SyntaxError);
expect(() => parseQuery('(foo:) and (bar)')).toThrow(SyntaxError);
});
});
describe('matchQuery', () => {
describe('Equality check', () => {
it('orientation: should return true for a correct match (===)', () => {
expect(matchQuery('(orientation: portrait)', { orientation: 'portrait' })).toBe(true);
});
it('orientation: should return false for an incorrect match (===)', () => {
expect(matchQuery('(orientation: landscape)', { orientation: 'portrait' })).toBe(false);
});
it('prefers-color-scheme: should return true for a correct match (===)', () => {
expect(matchQuery('(prefers-color-scheme: dark)', { 'prefers-color-scheme': 'dark' })).toBe(true);
});
it('prefers-color-scheme: should return false for an incorrect match (===)', () => {
expect(matchQuery('(prefers-color-scheme: light)', { 'prefers-color-scheme': 'dark' })).toBe(false);
});
it('width: should return true for a correct match', () => {
expect(matchQuery('(width: 800px)', { width: 800 })).toBe(true);
});
it('width: should return false for an incorrect match', () => {
expect(matchQuery('(width: 800px)', { width: 900 })).toBe(false);
});
});
describe('Type', () => {
it('should return true for a correct match', () => {
expect(matchQuery('screen', { type: MediaQueryType.screen })).toBe(true);
});
it('should return false for an incorrect match', () => {
expect(
matchQuery('screen and (orientation: portrait)', {
type: MediaQueryType.print,
orientation: 'portrait',
}),
).toBe(false);
});
it('should return false for a media query without a type when type is specified in the value object', () => {
expect(matchQuery('(min-width: 500px)', { type: MediaQueryType.screen })).toBe(false);
});
it('should return true for a media query without a type when type is not specified in the value object', () => {
expect(matchQuery('(min-width: 500px)', { width: 700 })).toBe(true);
});
});
describe('Not', () => {
it('should return false when theres a match on a `not` query', () => {
expect(
matchQuery('not screen and (orientation: portrait)', {
type: MediaQueryType.screen,
orientation: 'landscape',
}),
).toBe(false);
});
it('should not disrupt an OR query', () => {
expect(
matchQuery('not screen and (color), screen and (min-height: 48em)', {
type: MediaQueryType.screen,
height: 1000,
}),
).toBe(true);
});
it('should return false for when type === all', () => {
expect(
matchQuery('not all and (min-width: 48em)', {
type: MediaQueryType.all,
width: 1000,
}),
).toBe(false);
});
it('should return true for inverted value', () => {
expect(matchQuery('not screen and (min-width: 48px)', { width: 24 })).toBe(true);
});
});
});
});