Skip to content

mat.core migration fixes #30116

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Dec 2, 2024
Merged

mat.core migration fixes #30116

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a4a0bcf
fix(material/schematics): error if stylesheet contains syntax errors
crisbeto Dec 2, 2024
11e39a2
fix(material/schematics): avoid parsing stylesheets that don't includ…
crisbeto Dec 2, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 24 additions & 10 deletions src/material/schematics/ng-update/migrations/mat-core-removal.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,8 @@ import {
WorkspacePath,
} from '@angular/cdk/schematics';

const MATERIAL_IMPORT_PATH = '@angular/material';

export class MatCoreMigration extends Migration<UpgradeData, DevkitContext> {
override enabled = true;
private _namespace: string | undefined;
Expand All @@ -25,16 +27,28 @@ export class MatCoreMigration extends Migration<UpgradeData, DevkitContext> {
}

override visitStylesheet(stylesheet: ResolvedResource): void {
const processor = new postcss.Processor([
{
postcssPlugin: 'mat-core-removal-v19-plugin',
AtRule: {
use: node => this._getNamespace(node),
include: node => this._handleAtInclude(node, stylesheet.filePath),
// Avoid parsing the template Material isn't used.
if (!stylesheet.content.includes(MATERIAL_IMPORT_PATH)) {
return;
}

try {
const processor = new postcss.Processor([
{
postcssPlugin: 'mat-core-removal-v19-plugin',
AtRule: {
use: node => this._getNamespace(node),
include: node => this._handleAtInclude(node, stylesheet.filePath),
},
},
},
]);
processor.process(stylesheet.content, {syntax: scss}).sync();
]);
processor.process(stylesheet.content, {syntax: scss}).sync();
} catch (e) {
this.logger.warn(
`Failed to migrate usages of mat.core in ${stylesheet.filePath} due to error:`,
);
this.logger.warn(e + '');
}
}

/** Handles updating the at-include rules of uses of the core mixin. */
Expand Down Expand Up @@ -70,7 +84,7 @@ export class MatCoreMigration extends Migration<UpgradeData, DevkitContext> {

/** Sets the namespace if the given at-rule if it is importing from @angular/material. */
private _getNamespace(node: postcss.AtRule): void {
if (!this._namespace && node.params.startsWith('@angular/material', 1)) {
if (!this._namespace && node.params.startsWith(MATERIAL_IMPORT_PATH, 1)) {
this._namespace = node.params.split(/\s+/)[2] || 'material';
}
}
Expand Down
9 changes: 8 additions & 1 deletion src/material/schematics/ng-update/test-cases/v19-mat-core-removal.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import {MIGRATION_PATH} from '../../paths';
const PROJECT_ROOT_DIR = '/projects/cdk-testing';
const THEME_FILE_PATH = join(PROJECT_ROOT_DIR, 'src/theme.scss');

describe('v15 legacy components migration', () => {
describe('v19 mat.core migration', () => {
let tree: UnitTestTree;

/** Writes multiple lines to a file. */
Expand Down Expand Up @@ -73,5 +73,12 @@ describe('v15 legacy components migration', () => {
],
});
});

it('should not break if there is an invalid syntax', async () => {
await runSassMigrationTest('', {
old: [`@use '@angular/material' as mat;`, `.foo { content: '; }`],
new: [`@use '@angular/material' as mat;`, `.foo { content: '; }`],
});
});
});
});
Loading