Skip to content

Commit

Permalink
fix(vite-plugin-angular): fix Angular v18/v19 support for ɵPendingTas…
Browse files Browse the repository at this point in the history
…ks (#1497)
  • Loading branch information
brandonroberts authored Dec 13, 2024
1 parent bdd03ae commit 3215ab4
Show file tree
Hide file tree
Showing 8 changed files with 910 additions and 713 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`GIVEN AutocompleteComponent > WHEN input value is empty > AND input is focused > THEN component should match snapshot 1`] = `
<div
id="root2"
ng-version="19.0.0"
ng-version="19.0.4"
>
<mat-form-field
class="mat-mdc-form-field ng-tns-c508571215-0 mat-mdc-form-field-type-mat-input mat-form-field-no-animations mat-form-field-appearance-fill mat-primary ng-untouched ng-pristine ng-valid mat-mdc-form-field-label-always-float mat-focused"
Expand Down Expand Up @@ -106,7 +106,7 @@ exports[`GIVEN AutocompleteComponent > WHEN input value is empty > AND input is
exports[`GIVEN AutocompleteComponent > WHEN input value is empty > THEN component should match snapshot 1`] = `
<div
id="root1"
ng-version="19.0.0"
ng-version="19.0.4"
>
<mat-form-field
class="mat-mdc-form-field ng-tns-c508571215-0 mat-mdc-form-field-type-mat-input mat-form-field-no-animations mat-form-field-appearance-fill mat-form-field-hide-placeholder mat-primary ng-untouched ng-pristine ng-valid"
Expand Down Expand Up @@ -207,7 +207,7 @@ exports[`GIVEN AutocompleteComponent > WHEN input value is empty > THEN componen
exports[`GIVEN AutocompleteComponent > WHEN input value is not empty > AND input is focused > THEN component should match snapshot 1`] = `
<div
id="root7"
ng-version="19.0.0"
ng-version="19.0.4"
>
<mat-form-field
class="mat-mdc-form-field ng-tns-c508571215-0 mat-mdc-form-field-type-mat-input mat-form-field-no-animations mat-form-field-appearance-fill mat-primary ng-untouched ng-pristine ng-valid mat-mdc-form-field-label-always-float mat-focused"
Expand Down Expand Up @@ -310,7 +310,7 @@ exports[`GIVEN AutocompleteComponent > WHEN input value is not empty > AND input
exports[`GIVEN AutocompleteComponent > WHEN input value is not empty > THEN component should match snapshot 1`] = `
<div
id="root6"
ng-version="19.0.0"
ng-version="19.0.4"
>
<mat-form-field
class="mat-mdc-form-field ng-tns-c508571215-0 mat-mdc-form-field-type-mat-input mat-form-field-no-animations mat-form-field-appearance-fill mat-form-field-hide-placeholder mat-primary ng-untouched ng-pristine ng-valid"
Expand Down
38 changes: 19 additions & 19 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -41,17 +41,17 @@
},
"private": true,
"dependencies": {
"@angular/animations": "^19.0.0",
"@angular/cdk": "^19.0.0",
"@angular/common": "^19.0.0",
"@angular/compiler": "^19.0.0",
"@angular/core": "^19.0.0",
"@angular/forms": "^19.0.0",
"@angular/material": "^19.0.0",
"@angular/platform-browser": "^19.0.0",
"@angular/platform-browser-dynamic": "^19.0.0",
"@angular/platform-server": "^19.0.0",
"@angular/router": "^19.0.0",
"@angular/animations": "19.0.4",
"@angular/cdk": "19.0.3",
"@angular/common": "19.0.4",
"@angular/compiler": "19.0.4",
"@angular/core": "19.0.4",
"@angular/forms": "19.0.4",
"@angular/material": "19.0.3",
"@angular/platform-browser": "19.0.4",
"@angular/platform-browser-dynamic": "19.0.4",
"@angular/platform-server": "19.0.4",
"@angular/router": "19.0.4",
"@astrojs/mdx": "^3.0.1",
"@astrojs/react": "^3.0.0",
"@babel/core": "^7.21.8",
Expand Down Expand Up @@ -80,17 +80,17 @@
"zone.js": "^0.15.0"
},
"devDependencies": {
"@angular-devkit/architect": "^0.1900.0",
"@angular-devkit/build-angular": "^19.0.0",
"@angular-devkit/core": "^19.0.0",
"@angular-devkit/schematics": "^19.0.0",
"@angular-devkit/architect": "0.1900.5",
"@angular-devkit/build-angular": "19.0.5",
"@angular-devkit/core": "19.0.5",
"@angular-devkit/schematics": "19.0.5",
"@angular-eslint/eslint-plugin": "18.3.1",
"@angular-eslint/eslint-plugin-template": "18.3.1",
"@angular-eslint/template-parser": "18.3.1",
"@angular/build": "^19.0.0",
"@angular/cli": "^19.0.0",
"@angular/compiler-cli": "^19.0.0",
"@angular/language-service": "^19.0.0",
"@angular/build": "19.0.5",
"@angular/cli": "19.0.5",
"@angular/compiler-cli": "19.0.4",
"@angular/language-service": "19.0.4",
"@astrojs/markdown-component": "^1.0.5",
"@commitlint/cli": "^17.4.2",
"@commitlint/config-conventional": "^17.4.2",
Expand Down
17 changes: 9 additions & 8 deletions packages/content/src/lib/render-task.service.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1,19 @@
import {
Injectable,
inject,
ɵPendingTasks as PendingTasks,
} from '@angular/core';
import { Injectable, inject } from '@angular/core';
import { ɵPendingTasksInternal as ɵPendingTasks } from '@angular/core';

@Injectable()
export class RenderTaskService {
#pendingTasks = inject(PendingTasks);
#pendingTasks = inject(ɵPendingTasks);

addRenderTask() {
return this.#pendingTasks.add();
}

clearRenderTask(id: number) {
this.#pendingTasks.remove(id);
clearRenderTask(clear: number | Function) {
if (typeof clear === 'function') {
clear();
} else if (typeof (this.#pendingTasks as any).remove === 'function') {
(this.#pendingTasks as any).remove(clear);
}
}
}
1 change: 1 addition & 0 deletions packages/platform/src/lib/deps-plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ export function depsPlugin(options?: Options): Plugin[] {
],
exclude: [
'@angular/platform-server',
'@analogjs/content',
'@analogjs/router',
'@nx/angular',
'@nx/vite',
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import { Plugin } from 'vite';

import { angularMajor, angularPatch } from './utils/devkit.js';

/**
* This plugin is a workaround for the ɵPendingTasks symbol being renamed
* to ɵPendingTasksInternal in Angular v19.0.4. The symbol is renamed to support previous versions of
* Angular with Analog that used the ɵPendingTasks symbol.
*
* Commmit: https://github.com/angular/angular/commit/24e317cb157bf1ef159ed8554f1b79cb3443edf4
*/
export function pendingTasksPlugin(): Plugin {
return {
name: 'analogjs-pending-tasks-plugin',
transform(code, id) {
if (
Number(`${angularMajor}.${angularPatch}`) < 19.4 &&
id.includes('analogjs-content.mjs')
) {
return {
code: code.replace('ɵPendingTasksInternal', 'ɵPendingTasks'),
};
}
return;
},
};
}
2 changes: 2 additions & 0 deletions packages/vite-plugin-angular/src/lib/angular-vite-plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ import {
MarkdownTemplateTransform,
} from './authoring/markdown-transform.js';
import { routerPlugin } from './router-plugin.js';
import { pendingTasksPlugin } from './angular-pending-tasks.plugin.js';

export interface PluginOptions {
tsconfig?: string;
Expand Down Expand Up @@ -444,6 +445,7 @@ export function angular(options?: PluginOptions): Plugin[] {
}),
(isStorybook && angularStorybookPlugin()) as Plugin,
routerPlugin(),
pendingTasksPlugin(),
].filter(Boolean) as Plugin[];

function findAnalogFiles(config: ResolvedConfig) {
Expand Down
13 changes: 9 additions & 4 deletions packages/vite-plugin-angular/src/lib/utils/devkit.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,16 @@ import * as sfc from './source-file-cache.js';

const require = createRequire(import.meta.url);

const angularVersion = Number(VERSION.major);
const angularMajor = Number(VERSION.major);
const angularMinor = Number(VERSION.minor);
const angularPatch = Number(VERSION.patch);
let sourceFileCache: any;
let cjt: Function;
let jt: any;

if (angularVersion < 15) {
if (angularMajor < 15) {
throw new Error('AnalogJS is not compatible with Angular v14 and lower');
} else if (angularVersion >= 15 && angularVersion < 16) {
} else if (angularMajor >= 15 && angularMajor < 16) {
const cp = require('@angular-devkit/build-angular/src/builders/browser-esbuild/compiler-plugin.js');
const {
createJitResourceTransformer,
Expand All @@ -24,7 +26,7 @@ if (angularVersion < 15) {
sourceFileCache = cp.SourceFileCache;
cjt = createJitResourceTransformer;
jt = JavaScriptTransformer;
} else if (angularVersion >= 16 && angularVersion < 18) {
} else if (angularMajor >= 16 && angularMajor < 18) {
const cp = require('@angular-devkit/build-angular/src/tools/esbuild/angular/compiler-plugin.js');
const {
createJitResourceTransformer,
Expand Down Expand Up @@ -61,4 +63,7 @@ export {
jt as JavaScriptTransformer,
sourceFileCache as SourceFileCache,
CompilerPluginOptions,
angularMajor,
angularMinor,
angularPatch,
};
Loading

0 comments on commit 3215ab4

Please sign in to comment.