Skip to content

Commit 6439fb0

Browse files
nex3nex3
authored
Merge pull request #2087 from sass/css-mixin-function
Add tests for plain-CSS `@function`
2 parents d9df8fc + 82125e0 commit 6439fb0

File tree

8 files changed

+455
-65
lines changed

8 files changed

+455
-65
lines changed

‎spec/css/function.hrx‎

Lines changed: 309 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,309 @@
1+
<===> lowercase/parameter/input.scss
2+
@function --a(--b <color>) {result: c}
3+
4+
<===> lowercase/parameter/output.css
5+
@function --a(--b <color>) {
6+
result: c;
7+
}
8+
9+
<===>
10+
================================================================================
11+
<===> lowercase/returns/input.scss
12+
@function --a() returns <ident> {result: b}
13+
14+
<===> lowercase/returns/output.css
15+
@function --a() returns <ident> {
16+
result: b;
17+
}
18+
19+
<===>
20+
================================================================================
21+
<===> lowercase/interpolation/input.scss
22+
@function --#{a}() {result: b}
23+
24+
<===> lowercase/interpolation/output.css
25+
@function --a() {
26+
result: b;
27+
}
28+
29+
<===>
30+
================================================================================
31+
<===> lowercase/result/sass_script/input.scss
32+
@function --a() {
33+
result: $b;
34+
}
35+
36+
<===> lowercase/result/sass_script/output.css
37+
@function --a() {
38+
result: $b;
39+
}
40+
41+
<===>
42+
================================================================================
43+
<===> lowercase/result/characters/input.scss
44+
@function --a() {
45+
result: {}#&%^*;
46+
}
47+
48+
<===> lowercase/result/characters/output.css
49+
@function --a() {
50+
result: {}#&%^*;
51+
}
52+
53+
<===>
54+
================================================================================
55+
<===> lowercase/result/interpolation/input.scss
56+
@function --a() {
57+
result: #{1 + 1};
58+
}
59+
60+
<===> lowercase/result/interpolation/output.css
61+
@function --a() {
62+
result: 2;
63+
}
64+
65+
<===>
66+
================================================================================
67+
<===> uppercase/result/sass_script/input.scss
68+
@FUNCTION --a() {
69+
result: $b;
70+
}
71+
72+
<===> uppercase/result/sass_script/output.css
73+
@FUNCTION --a() {
74+
result: $b;
75+
}
76+
77+
<===>
78+
================================================================================
79+
<===> uppercase/result/characters/input.scss
80+
@FUNCTION --a() {
81+
result: {}#&%^*;
82+
}
83+
84+
<===> uppercase/result/characters/output.css
85+
@FUNCTION --a() {
86+
result: {}#&%^*;
87+
}
88+
89+
<===>
90+
================================================================================
91+
<===> uppercase/result/interpolation/input.scss
92+
@FUNCTION --a() {
93+
result: #{1 + 1};
94+
}
95+
96+
<===> uppercase/result/interpolation/output.css
97+
@FUNCTION --a() {
98+
result: 2;
99+
}
100+
101+
<===>
102+
================================================================================
103+
<===> uppercase/result/nesting/input.scss
104+
@function --a() {
105+
RESULT: {b: c};
106+
}
107+
108+
<===> uppercase/result/nesting/output.css
109+
@function --a() {
110+
RESULT: {b: c};
111+
}
112+
113+
<===>
114+
================================================================================
115+
<===> interpolated/result/sass_script/input.scss
116+
@#{function} --a() {
117+
result: 1 + 1;
118+
}
119+
120+
<===> interpolated/result/sass_script/output.css
121+
@function --a() {
122+
result: 2;
123+
}
124+
125+
<===>
126+
================================================================================
127+
<===> interpolated/result/nested/input.sass
128+
@function --a()
129+
#{result}:
130+
b: c
131+
132+
<===> interpolated/result/nested/output.css
133+
@function --a() {
134+
result-b: c;
135+
}
136+
137+
<===>
138+
================================================================================
139+
<===> result/uppercase/sass_script/input.scss
140+
@function --a() {
141+
RESULT: $b;
142+
}
143+
144+
<===> result/uppercase/sass_script/output.css
145+
@function --a() {
146+
RESULT: $b;
147+
}
148+
149+
<===>
150+
================================================================================
151+
<===> result/uppercase/characters/input.scss
152+
@function --a() {
153+
RESULT: {}#&%^*;
154+
}
155+
156+
<===> result/uppercase/characters/output.css
157+
@function --a() {
158+
RESULT: {}#&%^*;
159+
}
160+
161+
<===>
162+
================================================================================
163+
<===> result/uppercase/interpolation/input.scss
164+
@function --a() {
165+
RESULT: #{1 + 1};
166+
}
167+
168+
<===> result/uppercase/interpolation/output.css
169+
@function --a() {
170+
RESULT: 2;
171+
}
172+
173+
<===>
174+
================================================================================
175+
<===> result/interpolated/sass_script/input.scss
176+
@function --a() {
177+
#{result}: 1 + 1;
178+
}
179+
180+
<===> result/interpolated/sass_script/output.css
181+
@function --a() {
182+
result: 2;
183+
}
184+
185+
<===>
186+
================================================================================
187+
<===> result/interpolated/nested/input.sass
188+
@function --a()
189+
#{result}:
190+
b: c
191+
192+
<===> result/interpolated/nested/output.css
193+
@function --a() {
194+
result-b: c;
195+
}
196+
197+
<===>
198+
================================================================================
199+
<===> result/style_rule/sass_script/input.scss
200+
.a {
201+
result: 1 + 1;
202+
}
203+
204+
<===> result/style_rule/sass_script/output.css
205+
.a {
206+
result: 2;
207+
}
208+
209+
<===>
210+
================================================================================
211+
<===> result/style_rule/interpolation/input.scss
212+
.a {
213+
result: #{1 + 1};
214+
}
215+
216+
<===> result/style_rule/interpolation/output.css
217+
.a {
218+
result: 2;
219+
}
220+
221+
<===>
222+
================================================================================
223+
<===> error/lowercase/result/nested/input.sass
224+
@function --a()
225+
result:
226+
b: c
227+
228+
<===> error/lowercase/result/nested/error
229+
Error: Nothing may be indented beneath a @function result.
230+
,
231+
3 | b: c
232+
| ^
233+
'
234+
input.sass 3:5 root stylesheet
235+
236+
<===>
237+
================================================================================
238+
<===> error/uppercase/result/nested/input.sass
239+
@FUNCTION --a()
240+
result:
241+
b: c
242+
243+
<===> error/uppercase/result/nested/error
244+
Error: Nothing may be indented beneath a @function result.
245+
,
246+
3 | b: c
247+
| ^
248+
'
249+
input.sass 3:5 root stylesheet
250+
251+
<===>
252+
================================================================================
253+
<===> error/interpolated/result/characters/input.scss
254+
@#{function} --a() {
255+
result: {}#&%^*;
256+
}
257+
258+
<===> error/interpolated/result/characters/error
259+
Error: expected "{".
260+
,
261+
2 | result: {}#&%^*;
262+
| ^
263+
'
264+
input.scss 2:18 root stylesheet
265+
266+
<===>
267+
================================================================================
268+
<===> error/result/uppercase/nested/input.sass
269+
@function --a()
270+
RESULT:
271+
b: c
272+
273+
<===> error/result/uppercase/nested/error
274+
Error: Nothing may be indented beneath a @function result.
275+
,
276+
3 | b: c
277+
| ^
278+
'
279+
input.sass 3:5 root stylesheet
280+
281+
<===>
282+
================================================================================
283+
<===> error/result/interpolated/characters/input.scss
284+
@function --a() {
285+
#{result}: {}#&%^*;
286+
}
287+
288+
<===> error/result/interpolated/characters/error
289+
Error: expected "{".
290+
,
291+
2 | #{result}: {}#&%^*;
292+
| ^
293+
'
294+
input.scss 2:21 root stylesheet
295+
296+
<===>
297+
================================================================================
298+
<===> error/result/style_rule/characters/input.scss
299+
.a {
300+
result: {}#&%^*;
301+
}
302+
303+
<===> error/result/style_rule/characters/error
304+
Error: expected "{".
305+
,
306+
2 | result: {}#&%^*;
307+
| ^
308+
'
309+
input.scss 2:18 root stylesheet

‎spec/css/mixin.hrx‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<===> error/css/mixin/input.scss
2+
@mixin --a {}
3+
4+
<===> error/css/mixin/error
5+
Error: Sass @mixin names beginning with -- are forbidden for forward-compatibility with plain CSS mixins.
6+
7+
For details, see https://sass-lang.com/d/css-function-mixin
8+
,
9+
1 | @mixin --a {}
10+
| ^^^
11+
'
12+
input.scss 1:8 root stylesheet

0 commit comments

Comments
 (0)