Skip to content

Commit c85f7dc

Browse files
kdinevkdinev
authored
Merge branch 'master' into bpachilova/fix-12608
2 parents a7adf00 + b838604 commit c85f7dc

File tree

3 files changed

+247
-0
lines changed

3 files changed

+247
-0
lines changed

‎projects/igniteui-angular/migrations/migration-collection.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -135,6 +135,11 @@
135135
"version": "15.0.4",
136136
"description": "Updates Ignite UI for Angular from v15.0.x to v15.0.4",
137137
"factory": "./update-15_0_4"
138+
},
139+
"migration-28": {
140+
"version": "15.0.11",
141+
"description": "Updates Ignite UI for Angular from v15.0.x to v15.0.11",
142+
"factory": "./update-15_0_11"
138143
}
139144
}
140145
}

‎projects/igniteui-angular/migrations/update-15_0_11/index.spec.ts

Lines changed: 194 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,194 @@
1+
import * as path from 'path';
2+
3+
import { EmptyTree } from '@angular-devkit/schematics';
4+
import { SchematicTestRunner, UnitTestTree } from '@angular-devkit/schematics/testing';
5+
6+
const version = '15.0.11';
7+
8+
describe(`Update to ${version}`, () => {
9+
let appTree: UnitTestTree;
10+
const schematicRunner = new SchematicTestRunner('ig-migrate', path.join(__dirname, '../migration-collection.json'));
11+
12+
const configJson = {
13+
defaultProject: 'testProj',
14+
projects: {
15+
testProj: {
16+
root: '/',
17+
sourceRoot: '/testSrc'
18+
}
19+
},
20+
schematics: {
21+
'@schematics/angular:component': {
22+
prefix: 'appPrefix'
23+
}
24+
}
25+
};
26+
27+
beforeEach(() => {
28+
appTree = new UnitTestTree(new EmptyTree());
29+
appTree.create('/angular.json', JSON.stringify(configJson));
30+
});
31+
32+
const migrationName = 'migration-28';
33+
34+
it('should replace CSS $grays parameters', async () => {
35+
appTree.create(
36+
`/testSrc/appPrefix/component/test.component.scss`,
37+
`$my-palette: palette(
38+
$primary: #09f,
39+
$secondary: #e41c77,
40+
$grays: #000
41+
);
42+
$my-palette: palette(
43+
$primary: #09f,
44+
$secondary: #e41c77,
45+
$grays: #000123
46+
);`
47+
);
48+
49+
const tree = await schematicRunner
50+
.runSchematicAsync(migrationName, {}, appTree)
51+
.toPromise();
52+
53+
expect(
54+
tree.readContent('/testSrc/appPrefix/component/test.component.scss')
55+
).toEqual(
56+
`$my-palette: palette(
57+
$primary: #09f,
58+
$secondary: #e41c77,
59+
$gray: #000
60+
);
61+
$my-palette: palette(
62+
$primary: #09f,
63+
$secondary: #e41c77,
64+
$gray: #000123
65+
);`
66+
);
67+
});
68+
69+
it('should replace CSS $grays parameters variations', async () => {
70+
appTree.create(
71+
`/testSrc/appPrefix/component/test.component.scss`,
72+
`$my-palette: palette(
73+
$grays: red,
74+
$grays: rgb(204, 102, 153),
75+
$grays: rgba(107, 113, 127, 0.8),
76+
$grays: hsl(228, 7%, 86%),
77+
$grays: hsla(20, 20%, 85%, 0.7),
78+
);
79+
$my-palette: palette(
80+
$grays: red,
81+
$grays: rgb(204, 102, 153),
82+
$grays: rgba(107, 113, 127, 0.8),
83+
$grays: hsl(228, 7%, 86%),
84+
$grays: hsla(20, 20%, 85%, 0.7),
85+
);`
86+
);
87+
88+
const tree = await schematicRunner
89+
.runSchematicAsync(migrationName, {}, appTree)
90+
.toPromise();
91+
92+
expect(
93+
tree.readContent('/testSrc/appPrefix/component/test.component.scss')
94+
).toEqual(
95+
`$my-palette: palette(
96+
$gray: red,
97+
$gray: rgb(204, 102, 153),
98+
$gray: rgba(107, 113, 127, 0.8),
99+
$gray: hsl(228, 7%, 86%),
100+
$gray: hsla(20, 20%, 85%, 0.7),
101+
);
102+
$my-palette: palette(
103+
$gray: red,
104+
$gray: rgb(204, 102, 153),
105+
$gray: rgba(107, 113, 127, 0.8),
106+
$gray: hsl(228, 7%, 86%),
107+
$gray: hsla(20, 20%, 85%, 0.7),
108+
);`
109+
);
110+
});
111+
112+
it('should NOT replace $grays as custom var', async () => {
113+
appTree.create(
114+
`/testSrc/appPrefix/component/test.component.scss`,
115+
`$grays: #FFFFFF;`
116+
);
117+
118+
const tree = await schematicRunner
119+
.runSchematicAsync(migrationName, {}, appTree)
120+
.toPromise();
121+
122+
expect(
123+
tree.readContent('/testSrc/appPrefix/component/test.component.scss')
124+
).toEqual(
125+
`$grays: #FFFFFF;`
126+
);
127+
});
128+
129+
it('should replace grays as value', async () => {
130+
appTree.create(
131+
`/testSrc/appPrefix/component/test.component.scss`,
132+
`.my-class {
133+
color: contrast-color($color: 'grays', $variant: 300);
134+
}`
135+
);
136+
137+
const tree = await schematicRunner
138+
.runSchematicAsync(migrationName, {}, appTree)
139+
.toPromise();
140+
141+
expect(
142+
tree.readContent('/testSrc/appPrefix/component/test.component.scss')
143+
).toEqual(
144+
`.my-class {
145+
color: contrast-color($color: 'gray', $variant: 300);
146+
}`
147+
);
148+
});
149+
150+
it('should replace .igx-typography with .ig-typography as style', async () => {
151+
appTree.create(
152+
`/testSrc/appPrefix/component/test.component.scss`,
153+
`.igx-typography {
154+
h1, h2, h3, h4, h5, h6, p, .igx-typography__body-1 {
155+
margin: 0;
156+
}
157+
}`);
158+
159+
const tree = await schematicRunner
160+
.runSchematicAsync(migrationName, {}, appTree)
161+
.toPromise();
162+
163+
expect(
164+
tree.readContent('/testSrc/appPrefix/component/test.component.scss')
165+
).toEqual(
166+
`.ig-typography {
167+
h1, h2, h3, h4, h5, h6, p, .ig-typography__body-1 {
168+
margin: 0;
169+
}
170+
}`
171+
);
172+
});
173+
174+
it('should replace igx-typography & igx-scrollbar from template', async () => {
175+
appTree.create(
176+
`/testSrc/appPrefix/component/test.component.html`,
177+
`<body class="igx-typography igx-scrollbar">
178+
<app-root></app-root>
179+
</body>`
180+
);
181+
182+
const tree = await schematicRunner
183+
.runSchematicAsync(migrationName, {}, appTree)
184+
.toPromise();
185+
186+
expect(
187+
tree.readContent('/testSrc/appPrefix/component/test.component.html')
188+
).toEqual(
189+
`<body class="ig-typography ig-scrollbar">
190+
<app-root></app-root>
191+
</body>`
192+
);
193+
});
194+
});

‎projects/igniteui-angular/migrations/update-15_0_11/index.ts

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
import {
2+
Rule,
3+
SchematicContext,
4+
Tree
5+
} from '@angular-devkit/schematics';
6+
import { UpdateChanges } from '../common/UpdateChanges';
7+
8+
const version = '15.0.11';
9+
10+
export default (): Rule => async (host: Tree, context: SchematicContext) => {
11+
context.logger.info(`Applying migration for Ignite UI for Angular to version ${version}`);
12+
const update = new UpdateChanges(__dirname, host, context);
13+
update.applyChanges();
14+
15+
const updateTypographyAndScrollbar = (content: string) => {
16+
const typography = /igx-typography/g,
17+
scrollbar = /igx-scrollbar/g;
18+
return content
19+
.replace(typography, 'ig-typography')
20+
.replace(scrollbar, 'ig-scrollbar');
21+
};
22+
23+
const indexPath = '/src/index.html';
24+
if (host.exists(indexPath)) {
25+
host.overwrite(indexPath, updateTypographyAndScrollbar(host.read(indexPath).toString()));
26+
}
27+
28+
update.templateFiles.forEach(path =>
29+
host.overwrite(path, updateTypographyAndScrollbar(host.read(path).toString()))
30+
);
31+
32+
const graysVar = /\$grays:\s*(.+)(\r\n|\r|\n|,)/,
33+
graysString = /'grays'/g,
34+
graysTarget = `'gray'`;
35+
update.sassFiles.forEach(path => {
36+
let content = host.read(path).toString();
37+
const matches = content.matchAll(new RegExp(graysVar, 'g'));
38+
for (const match of matches) {
39+
content = content.replace(graysVar, `$gray: ${match[1]}${match[2]}`);
40+
}
41+
42+
if (graysString.test(content)) {
43+
content = content.replace(graysString, graysTarget);
44+
}
45+
46+
host.overwrite(path, updateTypographyAndScrollbar(content));
47+
});
48+
};

0 commit comments

Comments
 (0)