@@ -89,6 +89,26 @@ describe('theming api', () => {
89
89
expectNoWarning ( / T h e s a m e c o l o r s t y l e s a r e g e n e r a t e d m u l t i p l e t i m e s / ) ;
90
90
} ) ;
91
91
92
+ it ( 'should be possible to modify color configuration directly' , ( ) => {
93
+ const result = transpile ( `
94
+ $theme: mat-light-theme((
95
+ color: (
96
+ primary: mat-define-palette($mat-red),
97
+ accent: mat-define-palette($mat-blue),
98
+ )
99
+ ));
100
+
101
+ // Updates the "icon" foreground color to "canary".
102
+ $color: map-get($theme, color);
103
+ $theme: map-merge($color,
104
+ (foreground: map-merge(map-get($color, foreground), (icon: "canary"))));
105
+
106
+ @include angular-material-theme($theme);
107
+ ` ) ;
108
+
109
+ expect ( result ) . toContain ( ': "canary"' ) ;
110
+ } ) ;
111
+
92
112
it ( 'should warn if default density styles are duplicated' , ( ) => {
93
113
spyOn ( process . stderr , 'write' ) ;
94
114
@@ -170,104 +190,6 @@ describe('theming api', () => {
170
190
expect ( process . stderr . write ) . toHaveBeenCalledTimes ( 0 ) ;
171
191
} ) ;
172
192
173
- describe ( 'legacy API' , ( ) => {
174
- it ( 'should warn if color styles are duplicated' , ( ) => {
175
- spyOn ( process . stderr , 'write' ) ;
176
-
177
- transpile ( `
178
- $theme: mat-light-theme($mat-red, $mat-blue);
179
- @include angular-material-theme($theme);
180
- .dark-theme {
181
- @include angular-material-theme($theme);
182
- }
183
- ` ) ;
184
-
185
- expectWarning ( / T h e s a m e c o l o r s t y l e s a r e g e n e r a t e d m u l t i p l e t i m e s / ) ;
186
- } ) ;
187
-
188
- it ( 'should only generate default density once' , ( ) => {
189
- const parsed = parse (
190
- transpile ( `
191
- $light-theme: mat-light-theme($mat-red, $mat-blue);
192
- $dark-theme: mat-dark-theme($mat-red, $mat-blue);
193
- $third-theme: mat-dark-theme($mat-grey, $mat-blue);
194
-
195
- @include angular-material-theme($light-theme);
196
-
197
- .dark-theme {
198
- @include angular-material-theme($dark-theme);
199
- }
200
-
201
- .third-theme {
202
- @include angular-material-theme($third-theme);
203
- }
204
- ` ) ,
205
- ) ;
206
-
207
- expect ( hasDensityStyles ( parsed , null ) ) . toBe ( 'all' ) ;
208
- expect ( hasDensityStyles ( parsed , '.dark-theme' ) ) . toBe ( 'none' ) ;
209
- expect ( hasDensityStyles ( parsed , '.third-theme' ) ) . toBe ( 'none' ) ;
210
- } ) ;
211
-
212
- it ( 'should always generate default density at root' , ( ) => {
213
- const parsed = parse (
214
- transpile ( `
215
- $light-theme: mat-light-theme($mat-red, $mat-blue);
216
-
217
- .my-app-theme {
218
- @include angular-material-theme($light-theme);
219
- }
220
- ` ) ,
221
- ) ;
222
-
223
- expect ( hasDensityStyles ( parsed , null ) ) . toBe ( 'all' ) ;
224
- expect ( hasDensityStyles ( parsed , '.my-app-theme' ) ) . toBe ( 'none' ) ;
225
- } ) ;
226
-
227
- it ( 'not warn if default density would be generated multiple times' , ( ) => {
228
- transpile ( `
229
- $light-theme: mat-light-theme($mat-red, $mat-blue);
230
- $dark-theme: mat-dark-theme($mat-red, $mat-blue);
231
-
232
- @include angular-material-theme($light-theme);
233
- .dark-theme {
234
- @include angular-material-theme($dark-theme);
235
- }
236
- ` ) ;
237
-
238
- expectNoWarning ( / T h e s a m e d e n s i t y s t y l e s a r e g e n e r a t e d m u l t i p l e t i m e s / ) ;
239
- } ) ;
240
-
241
- it ( 'should be possible to modify color configuration directly' , ( ) => {
242
- const result = transpile ( `
243
- $theme: mat-light-theme($mat-red, $mat-blue);
244
-
245
- // Updates the "icon" foreground color to "canary".
246
- $theme: map-merge($theme,
247
- (foreground: map-merge(map-get($theme, foreground), (icon: "canary"))));
248
-
249
- @include angular-material-theme($theme);
250
- ` ) ;
251
-
252
- expect ( result ) . toContain ( ': "canary"' ) ;
253
- } ) ;
254
-
255
- it ( 'should be possible to specify palettes by keyword' , ( ) => {
256
- transpile ( `
257
- $light-theme: mat-light-theme(
258
- $primary: mat-define-palette($mat-red),
259
- $accent: mat-define-palette($mat-blue),
260
- $warn: mat-define-palette($mat-red),
261
- );
262
- $dark-theme: mat-dark-theme(
263
- $primary: mat-define-palette($mat-red),
264
- $accent: mat-define-palette($mat-blue),
265
- $warn: mat-define-palette($mat-red),
266
- );
267
- ` ) ;
268
- } ) ;
269
- } ) ;
270
-
271
193
/**
272
194
* Checks whether the given parsed stylesheet contains density styles scoped to
273
195
* a given selector. If the selector is `null`, then density is expected to be
0 commit comments