chore: use vitest for unit testing plus workspace updates (#10662)

2025-11-05 13:26:48 +08:00 · 2025-01-12 11:52:13 -08:00
parent baced677f8
commit 3dec0a5e99
32 changed files with 4927 additions and 2931 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -58,3 +58,5 @@ ios-typings-prj

 .nx/cache
 .nx/workspace-data
+vite.config.*.timestamp*
+vitest.config.*.timestamp*
--- a/apps/automated/package.json
+++ b/apps/automated/package.json
@@ -16,7 +16,7 @@
    "@nativescript/visionos": "~8.8.0",
    "@nativescript/webpack": "file:../../dist/packages/nativescript-webpack.tgz",
    "circular-dependency-plugin": "^5.2.2",
-    "typescript": "~5.4.0"
+    "typescript": "~5.6.0"
  },
  "gitHead": "c06800e52ee1a184ea2dffd12a6702aaa43be4e3",
  "readme": "NativeScript Application"
--- a/apps/toolbox/package.json
+++ b/apps/toolbox/package.json
@@ -16,6 +16,6 @@
    "@nativescript/ios": "~8.8.0",
    "@nativescript/visionos": "~8.8.0",
    "@nativescript/webpack": "file:../../dist/packages/nativescript-webpack.tgz",
-    "typescript": "~5.4.0"
+    "typescript": "~5.6.0"
  }
 }
--- a/apps/ui/package.json
+++ b/apps/ui/package.json
@@ -15,7 +15,7 @@
    "@nativescript/ios": "~8.8.0",
    "@nativescript/visionos": "~8.8.0",
    "@nativescript/webpack": "file:../../dist/packages/nativescript-webpack.tgz",
-    "typescript": "~5.4.0"
+    "typescript": "~5.6.0"
  },
  "gitHead": "8ab7726d1ee9991706069c1359c552e67ee0d1a4",
  "readme": "NativeScript Application",
--- a/nx.json
+++ b/nx.json
@@ -106,6 +106,10 @@
 					"codeCoverage": true
 				}
 			}
+		},
+		"@nx/vite:test": {
+			"cache": true,
+			"inputs": ["default", "^production"]
 		}
 	},
 	"useDaemonProcess": false,
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -25,18 +25,25 @@
 		"@nativescript/nx": "^20.0.0",
 		"@nstudio/focus": "^20.0.2",
 		"@nstudio/nps-i": "~2.0.0",
-		"@nx/devkit": "20.1.2",
-		"@nx/eslint-plugin": "20.1.2",
-		"@nx/jest": "20.1.2",
-		"@nx/js": "20.1.2",
-		"@nx/node": "20.1.2",
-		"@nx/plugin": "20.1.2",
-		"@nx/workspace": "20.1.2",
+		"@nx/devkit": "20.3.0",
+		"@nx/eslint-plugin": "20.3.0",
+		"@nx/jest": "20.3.0",
+		"@nx/js": "20.3.0",
+		"@nx/node": "20.3.0",
+		"@nx/plugin": "20.3.0",
+		"@nx/vite": "20.3.0",
+		"@nx/web": "20.3.0",
+		"@nx/workspace": "20.3.0",
 		"@prettier/plugin-xml": "^3.4.1",
+		"@swc-node/register": "~1.9.1",
+		"@swc/core": "~1.5.7",
+		"@swc/helpers": "~0.5.11",
 		"@types/jest": "~29.5.0",
 		"@types/node": "^20.0.0",
 		"@typescript-eslint/eslint-plugin": "^8.6.0",
 		"@typescript-eslint/parser": "^8.6.0",
+		"@vitest/coverage-v8": "^1.0.4",
+		"@vitest/ui": "^1.3.1",
 		"acorn": "^8.7.0",
 		"conventional-changelog-cli": "^5.0.0",
 		"copyfiles": "^2.4.0",
@@ -45,17 +52,19 @@
 		"css-what": "^6.1.0",
 		"dotenv": "~16.4.0",
 		"emoji-regex": "^10.3.0",
+		"enhanced-resolve": "^5.8.3",
 		"eslint": "~8.57.0",
 		"eslint-config-prettier": "~9.1.0",
 		"gonzales": "^1.0.7",
 		"husky": "^9.0.0",
 		"jest": "~29.7.0",
 		"jest-environment-jsdom": "~29.7.0",
+		"jsdom": "~22.1.0",
 		"lint-staged": "^15.2.0",
 		"module-alias": "^2.2.2",
-		"nativescript": "~8.8.2",
+		"nativescript": "~8.8.3",
 		"nativescript-typedoc-theme": "1.1.0",
-		"nx": "20.1.2",
+		"nx": "20.3.0",
 		"parse-css": "git+https://github.com/tabatkins/parse-css.git",
 		"parserlib": "^1.1.1",
 		"prettier": "^3.2.5",
@@ -67,9 +76,11 @@
 		"ts-node": "10.9.2",
 		"ts-patch": "^3.0.0",
 		"tslib": "^2.6.0",
-		"typedoc": "^0.25.12",
-		"typescript": "~5.4.0",
-		"zx": "^7.2.0"
+		"typedoc": "^0.27.6",
+		"typescript": "~5.6.0",
+		"vite": "^5.0.0",
+		"vitest": "^1.3.1",
+		"zx": "^8.3.0"
 	},
 	"lint-staged": {
 		"**/*.{js,ts,css,scss,json,html}": [
--- a/packages/core/core-types/index.ts
+++ b/packages/core/core-types/index.ts
@@ -3,8 +3,8 @@
 */

 // imported for definition purposes only
-import * as animationModule from '../ui/animation';
 import { makeValidator, makeParser } from '../ui/core/properties';
+import { CubicBezierAnimationCurve } from '../ui/animation/animation-interfaces';

 export namespace CoreTypes {
 	/**
@@ -263,8 +263,6 @@ export namespace CoreTypes {
 		export const parse = makeParser<BackgroundRepeatType>(isValid);
 	}

-	let animation: typeof animationModule;
-
 	export namespace AnimationCurve {
 		export const ease = 'ease';
 		export const easeIn = 'easeIn';
@@ -273,9 +271,7 @@ export namespace CoreTypes {
 		export const linear = 'linear';
 		export const spring = 'spring';
 		export function cubicBezier(x1: number, y1: number, x2: number, y2: number) {
-			animation = animation || require('../ui/animation');
-
-			return new animation.CubicBezierAnimationCurve(x1, y1, x2, y2);
+			return new CubicBezierAnimationCurve(x1, y1, x2, y2);
 		}
 	}

--- a/packages/core/css/css-tree-parser.spec.ts
+++ b/packages/core/css/css-tree-parser.spec.ts
@@ -1,5 +1,5 @@
 import { cssTreeParse } from './css-tree-parser';
-import { parse as reworkCssParse } from './reworkcss';
+import { parse as reworkCssParse } from './reworkcss.js';

 describe('CssTreeParser', () => {
 	it('basic selector', () => {
--- a/packages/core/css/parser.spec.ts
+++ b/packages/core/css/parser.spec.ts
@@ -6,7 +6,7 @@ import { CSSNativeScript } from './CSSNativeScript';
 import * as fs from 'fs';
 import * as path from 'path';
 import * as shadyCss from 'shady-css-parser';
-import * as reworkCss from 'css';
+const reworkCss = await import('./reworkcss.js');

 const parseCss: any = require('parse-css');
 const gonzales: any = require('gonzales');
--- a/packages/core/css/parser.ts
+++ b/packages/core/css/parser.ts
@@ -54,7 +54,8 @@ export interface BackgroundPosition {
 	text?: string;
 }

-const urlRegEx = /\s*url\((?:(['"])([^\1]*)\1|([^)]*))\)\s*/gy;
+const urlRegEx = /\s*url\((?:(['"])(.*?)\1|([^)]*))\)\s*/gy;
+// const urlRegEx = /(?:^|\s*#[a-fA-F0-9]{3,6}\s*|^\s*)url\((['"]?)(.*?)\1\)\s*/gi;
 export function parseURL(text: string, start = 0): Parsed<URL> {
 	urlRegEx.lastIndex = start;
 	const result = urlRegEx.exec(text);
--- a/packages/core/globals/index.ts
+++ b/packages/core/globals/index.ts
@@ -378,12 +378,14 @@ export function initGlobal() {

 declare const jest: any;
 function isTestingEnv() {
-	return typeof jest !== 'undefined';
+	return typeof jest !== 'undefined' || global.__UNIT_TEST__;
 }

 if (!global.NativeScriptHasInitGlobal && !isTestingEnv()) {
 	initGlobal();
 }

-// ensure the Application instance is initialized before any other module imports it.
-require('@nativescript/core/application');
+if (!isTestingEnv()) {
+	// ensure the Application instance is initialized before any other module imports it.
+	require('@nativescript/core/application');
+}
--- a/packages/core/jest.config.ts
+++ b/packages/core/jest.config.ts
@@ -1,27 +0,0 @@
-import type { JestConfigWithTsJest } from 'ts-jest';
-
-/* eslint-disable */
-const jestConfig: JestConfigWithTsJest = {
-	displayName: 'core',
-	// preset: '../../jest.preset.js',
-	preset: 'ts-jest/presets/default-esm',
-	setupFiles: ['<rootDir>/jest.setup.ts'],
-	testEnvironment: 'node',
-	transform: {
-		'^.+\\.tsx?$': [
-			'ts-jest',
-			{
-				useESM: true,
-				tsconfig: '<rootDir>/tsconfig.spec.json',
-			},
-		],
-	},
-	extensionsToTreatAsEsm: ['.ts'],
-	moduleDirectories: ['node_modules'],
-	moduleFileExtensions: ['ts', 'js', 'ios.ts'],
-	moduleNameMapper: {
-		'^(\\.{1,2}/.*)\\.js$': '$1',
-	},
-};
-
-export default jestConfig;
--- a/packages/core/project.json
+++ b/packages/core/project.json
@@ -15,15 +15,6 @@
 				"lintFilePatterns": ["packages/core/**/*.ts", "packages/core/references.d.ts", "packages/core/**/*.spec.ts", "packages/core/**/*.spec.tsx", "packages/core/**/*.spec.js", "packages/core/**/*.spec.jsx", "packages/core/**/*.d.ts"]
 			}
 		},
-		"test": {
-			"executor": "@nx/jest:jest",
-			"inputs": ["default", "^production"],
-			"outputs": ["{workspaceRoot}/dist/out-tsc"],
-			"options": {
-				"jestConfig": "packages/core/jest.config.ts",
-				"verbose": true
-			}
-		},
 		"build": {
 			"executor": "nx:run-commands",
 			"inputs": ["default", "^production"],
@@ -32,13 +23,20 @@
 				"commands": [
 					"npx rimraf dist/packages/core",
 					"npx tsc -p packages/core/tsconfig.lib.json",
-					"npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/**/*.d.ts\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/js-libs/**/*\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/cli-hooks/**/*.js\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/platforms/**/*\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/fetch/**/*\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/css/**/*\" dist && npx copyfiles -e \"packages/core/__tests__/**/*\" \"packages/core/css-value/**/*\" dist",
+					"npx copyfiles -e \"packages/core/**/*.d.ts\" dist && npx copyfiles -e \"packages/core/js-libs/**/*\" dist && npx copyfiles -e \"packages/core/cli-hooks/**/*.js\" dist && npx copyfiles -e \"packages/core/platforms/**/*\" dist && npx copyfiles -e \"packages/core/fetch/**/*\" dist && npx copyfiles -e \"packages/core/css/**/*\" dist && npx copyfiles -e \"packages/core/css-value/**/*\" dist",
 					"npx copyfiles -f \"packages/core/package.json\" \"packages/core/README.md\" \"LICENSE\" dist/packages/core",
 					"cd dist/packages/core && npm pack --pack-destination=.."
 				],
 				"cwd": ".",
 				"parallel": false
 			}
+		},
+		"test": {
+			"executor": "@nx/vite:test",
+			"outputs": ["{options.reportsDirectory}"],
+			"options": {
+				"reportsDirectory": "../../coverage/packages/core"
+			}
 		}
 	}
 }
--- a/packages/core/tsconfig.lib.json
+++ b/packages/core/tsconfig.lib.json
@@ -21,6 +21,6 @@
 			}
 		]
 	},
-	"exclude": ["**/*.spec.ts", "**/*.test.ts", "dist", "__tests__", "jest.config.ts", "jest.setup.ts"],
+	"exclude": ["**/*.spec.ts", "**/*.test.ts", "dist", "__tests__", "vite.config.ts", "vitest.setup.ts"],
 	"include": ["**/*.ts", "./references.d.ts"]
 }
--- a/packages/core/tsconfig.spec.json
+++ b/packages/core/tsconfig.spec.json
@@ -1,13 +1,11 @@
 {
+	"extends": "./tsconfig.json",
 	"compilerOptions": {
 		"outDir": "../../dist/out-tsc",
-		"types": ["jest", "node"],
-		"target": "ESNext",
-		"module": "esnext",
-		"moduleResolution": "node",
 		"esModuleInterop": true,
+		"allowSyntheticDefaultImports": true,
 		"allowJs": true,
-		"experimentalDecorators": true
+		"types": ["vitest/globals", "vitest/importMeta", "vite/client", "node", "vitest"]
 	},
-	"include": ["./references.d.ts", "**/*.spec.ts"]
+	"include": ["references.d.ts", "vite.config.ts", "vitest.setup.ts", "**/*.test.ts", "**/*.spec.ts", "**/*.ts", "**/*.ios.ts"]
 }
--- a/packages/core/ui/animation/animation-common.ts
+++ b/packages/core/ui/animation/animation-common.ts
@@ -1,5 +1,5 @@
 // Types.
-import { CubicBezierAnimationCurve as CubicBezierAnimationCurveDefinition, Animation as AnimationBaseDefinition, Point3D } from '.';
+import { Animation as AnimationBaseDefinition, Point3D } from '.';
 import { AnimationDefinition, AnimationPromise as AnimationPromiseDefinition, Pair, PropertyAnimation } from './animation-interfaces';

 // Requires.
@@ -19,20 +19,6 @@ export namespace Properties {
 	export const width = 'width';
 }

-export class CubicBezierAnimationCurve implements CubicBezierAnimationCurveDefinition {
-	public x1: number;
-	public y1: number;
-	public x2: number;
-	public y2: number;
-
-	constructor(x1: number, y1: number, x2: number, y2: number) {
-		this.x1 = x1;
-		this.y1 = y1;
-		this.x2 = x2;
-		this.y2 = y2;
-	}
-}
-
 export abstract class AnimationBase implements AnimationBaseDefinition {
 	public _propertyAnimations: Array<PropertyAnimation>;
 	public _playSequentially: boolean;
--- a/packages/core/ui/animation/animation-interfaces.ts
+++ b/packages/core/ui/animation/animation-interfaces.ts
@@ -71,3 +71,21 @@ export interface IOSView extends View {
 	_resumePresentationLayerUpdates();
 	_isPresentationLayerUpdateSuspended();
 }
+
+/**
+ * Defines a custom animation timing curve by using the cubic-bezier function.
+ * Possible values are numeric values from 0 to 1
+ */
+export class CubicBezierAnimationCurve {
+	public x1: number;
+	public y1: number;
+	public x2: number;
+	public y2: number;
+
+	constructor(x1: number, y1: number, x2: number, y2: number) {
+		this.x1 = x1;
+		this.y1 = y1;
+		this.x2 = x2;
+		this.y2 = y2;
+	}
+}
--- a/packages/core/ui/animation/index.android.ts
+++ b/packages/core/ui/animation/index.android.ts
@@ -1,9 +1,6 @@
-// Types.
-import { AnimationDefinitionInternal, AnimationPromise, PropertyAnimation } from './animation-common';
+import { AnimationDefinitionInternal, AnimationPromise, PropertyAnimation, AnimationBase, Properties } from './animation-common';
 import { View } from '../core/view';
-
-// Requires
-import { AnimationBase, Properties, CubicBezierAnimationCurve } from './animation-common';
+import { CubicBezierAnimationCurve } from './animation-interfaces';
 import { Color } from '../../color';
 import { Trace } from '../../trace';
 import { opacityProperty, backgroundColorProperty, rotateProperty, rotateXProperty, rotateYProperty, translateXProperty, translateYProperty, scaleXProperty, scaleYProperty, heightProperty, widthProperty, PercentLength } from '../styling/style-properties';
@@ -325,7 +322,7 @@ export class Animation extends AnimationBase {
 							const argb = (<java.lang.Integer>animator.getAnimatedValue()).intValue();
 							propertyAnimation.target.style[setLocal ? backgroundColorProperty.name : backgroundColorProperty.keyframe] = new Color(argb);
 						},
-					})
+					}),
 				);

 				propertyUpdateCallbacks.push(() => {
@@ -466,7 +463,7 @@ export class Animation extends AnimationBase {
 							const argb = (<java.lang.Float>animator.getAnimatedValue()).floatValue();
 							propertyAnimation.target.style[setLocal ? extentProperty.name : extentProperty.keyframe] = argb;
 						},
-					})
+					}),
 				);
 				propertyUpdateCallbacks.push(() => {
 					propertyAnimation.target.style[targetStyle] = propertyAnimation.value;
--- a/packages/core/ui/animation/index.d.ts
+++ b/packages/core/ui/animation/index.d.ts
@@ -72,19 +72,6 @@ export interface AnimationDefinition {
 	curve?: any;
 }

-/**
- * Defines a custom animation timing curve by using the cubic-bezier function.
- * Possible values are numeric values from 0 to 1
- */
-export class CubicBezierAnimationCurve {
-	public x1: number;
-	public y1: number;
-	public x2: number;
-	public y2: number;
-
-	constructor(x1: number, y1: number, x2: number, y2: number);
-}
-
 /**
 * Defines a key-value pair for css transformation
 */
--- a/packages/core/ui/animation/index.ios.ts
+++ b/packages/core/ui/animation/index.ios.ts
@@ -1,9 +1,7 @@
 // Types
-import { AnimationDefinitionInternal, AnimationPromise, IOSView, PropertyAnimation, PropertyAnimationInfo } from './animation-common';
+import { AnimationDefinitionInternal, AnimationPromise, IOSView, PropertyAnimation, PropertyAnimationInfo, AnimationBase, Properties } from './animation-common';
 import { View } from '../core/view';
-
-// Requires
-import { AnimationBase, Properties, CubicBezierAnimationCurve } from './animation-common';
+import { CubicBezierAnimationCurve } from './animation-interfaces';
 import { Trace } from '../../trace';
 import { opacityProperty, backgroundColorProperty, rotateProperty, rotateXProperty, rotateYProperty, translateXProperty, translateYProperty, scaleXProperty, scaleYProperty, heightProperty, widthProperty, PercentLength } from '../styling/style-properties';
 import { ios as iosBackground } from '../styling/background';
@@ -134,9 +132,7 @@ export function _resolveAnimationCurve(curve: string | CubicBezierAnimationCurve
 			if (curve instanceof CAMediaTimingFunction) {
 				return curve;
 			} else if (curve instanceof CubicBezierAnimationCurve) {
-				const animationCurve = <CubicBezierAnimationCurve>curve;
-
-				return CAMediaTimingFunction.functionWithControlPoints(animationCurve.x1, animationCurve.y1, animationCurve.x2, animationCurve.y2);
+				return CAMediaTimingFunction.functionWithControlPoints(curve.x1, curve.y1, curve.x2, curve.y2);
 			} else {
 				console.error(`Invalid animation curve: ${curve}`);
 			}
@@ -660,7 +656,7 @@ export class Animation extends AnimationBase {
 				if (animationDidFinish && nextAnimation) {
 					nextAnimation();
 				}
-			}
+			},
 		);
 	}

@@ -786,9 +782,9 @@ export class Animation extends AnimationBase {
 							fromValue: nativeView.layer.mask.path,
 							toValue,
 						},
-						animation
+						animation,
 					),
-					'path'
+					'path',
 				);
 			}
 		}
@@ -809,9 +805,9 @@ export class Animation extends AnimationBase {
 									fromValue: borderMask.path,
 									toValue: innerClipPath,
 								},
-								animation
+								animation,
 							),
-							'path'
+							'path',
 						);
 					}

@@ -830,9 +826,9 @@ export class Animation extends AnimationBase {
 											fromValue: layer.path,
 											toValue: paths[i],
 										},
-										animation
+										animation,
 									),
-									'path'
+									'path',
 								);
 							}
 						}
@@ -846,9 +842,9 @@ export class Animation extends AnimationBase {
 								fromValue: nativeView.borderLayer.path,
 								toValue: innerClipPath,
 							},
-							animation
+							animation,
 						),
-						'path'
+						'path',
 					);
 				}
 			}
@@ -864,9 +860,9 @@ export class Animation extends AnimationBase {
 							fromValue: nativeView.layer.cornerRadius,
 							toValue: iosBackground.getUniformBorderRadius(animation.target, bounds),
 						},
-						animation
+						animation,
 					),
-					'cornerRadius'
+					'cornerRadius',
 				);
 			}
 		}
@@ -885,9 +881,9 @@ export class Animation extends AnimationBase {
 							fromValue: shadowClipMask.path,
 							toValue: clipPath,
 						},
-						animation
+						animation,
 					),
-					'path'
+					'path',
 				);
 			}

@@ -906,9 +902,9 @@ export class Animation extends AnimationBase {
 								fromValue: shadowLayer.shadowPath,
 								toValue: shadowPath,
 							},
-							animation
+							animation,
 						),
-						'shadowPath'
+						'shadowPath',
 					);

 					if (shadowLayer.mask instanceof CAShapeLayer) {
@@ -920,9 +916,9 @@ export class Animation extends AnimationBase {
 									fromValue: shadowLayer.mask.path,
 									toValue: maskPath,
 								},
-								animation
+								animation,
 							),
-							'path'
+							'path',
 						);
 					}
 				}
--- a/packages/core/ui/styling/background.ios.ts
+++ b/packages/core/ui/styling/background.ios.ts
@@ -8,7 +8,8 @@ import { Screen } from '../../platform';
 import { isDataURI, isFileOrResourcePath, layout } from '../../utils';
 import { ios as iosViewUtils, NativeScriptUIView } from '../utils';
 import { ImageSource } from '../../image-source';
-import { CSSValue, parse as cssParse } from '../../css-value';
+import type { CSSValue } from '../../css-value/reworkcss-value';
+import { parse as cssParse } from '../../css-value/reworkcss-value.js';
 import { BoxShadow } from './box-shadow';
 import { Length } from './style-properties';
 import { BackgroundClearFlags } from './background-common';
--- a/packages/core/ui/styling/css-animation-parser.spec.ts
+++ b/packages/core/ui/styling/css-animation-parser.spec.ts
@@ -3,6 +3,19 @@ import type { KeyframeAnimationInfo, KeyframeInfo } from '../animation';
 import { CssAnimationParser, keyframeAnimationsFromCSSProperty } from './css-animation-parser';
 import { cssTreeParse } from '../../css/css-tree-parser';

+function getCurves() {
+	return {
+		ease: CoreTypes.AnimationCurve.ease,
+		linear: CoreTypes.AnimationCurve.linear,
+		'ease-in': CoreTypes.AnimationCurve.easeIn,
+		'ease-out': CoreTypes.AnimationCurve.easeOut,
+		'ease-in-out': CoreTypes.AnimationCurve.easeInOut,
+		spring: CoreTypes.AnimationCurve.spring,
+		'cubic-bezier(0.1, 1.0, 0.5, 0.5)': CoreTypes.AnimationCurve.cubicBezier(0.1, 1.0, 0.5, 0.5),
+		'cubic-bezier(0.42, 0.0, 1.0, 1.0);': CoreTypes.AnimationCurve.cubicBezier(0.42, 0.0, 1.0, 1.0),
+	};
+}
+
 describe('css-animation-parser', () => {
 	describe('shorthand-property-parser', () => {
 		// helper functions
@@ -36,17 +49,6 @@ describe('css-animation-parser', () => {
 			'3s': 3000,
 		};

-		const curves = {
-			ease: CoreTypes.AnimationCurve.ease,
-			linear: CoreTypes.AnimationCurve.linear,
-			'ease-in': CoreTypes.AnimationCurve.easeIn,
-			'ease-out': CoreTypes.AnimationCurve.easeOut,
-			'ease-in-out': CoreTypes.AnimationCurve.easeInOut,
-			spring: CoreTypes.AnimationCurve.spring,
-			'cubic-bezier(0.1, 1.0, 0.5, 0.5)': CoreTypes.AnimationCurve.cubicBezier(0.1, 1.0, 0.5, 0.5),
-			'cubic-bezier(0.42, 0.0, 1.0, 1.0);': CoreTypes.AnimationCurve.cubicBezier(0.42, 0.0, 1.0, 1.0),
-		};
-
 		it('parses duration', () => {
 			Object.entries(times).forEach(([timeString, ms]) => {
 				expect(testSingleAnimation(`${timeString}`).duration).toBe(ms);
@@ -70,6 +72,7 @@ describe('css-animation-parser', () => {
 		});

 		it('parses curve', () => {
+			const curves = getCurves();
 			Object.entries(curves).forEach(([curveString, curve]) => {
 				const animation = testSingleAnimation(`${curveString}`);
 				expect(animation.curve).toEqual(curve);
@@ -77,6 +80,7 @@ describe('css-animation-parser', () => {
 		});

 		it('parses duration, curve and delay', () => {
+			const curves = getCurves();
 			Object.entries(curves).forEach(([curveString, curve]) => {
 				const animation1 = testSingleAnimation(`225ms 300ms ${curveString}`);
 				expect(animation1.duration).toBe(225);
@@ -259,7 +263,7 @@ describe('css-animation-parser', () => {
 				`@keyframes fade {
 					from { opacity: 0; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(1);
@@ -276,7 +280,7 @@ describe('css-animation-parser', () => {
 				`@keyframes fade {
 					to { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(1);
@@ -294,7 +298,7 @@ describe('css-animation-parser', () => {
 					from { opacity: 0; }
 					to { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(2);
@@ -316,7 +320,7 @@ describe('css-animation-parser', () => {
 				`@keyframes fade {
 					0% { opacity: 0; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(1);
@@ -333,7 +337,7 @@ describe('css-animation-parser', () => {
 				`@keyframes fade {
 					100% { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(1);
@@ -351,7 +355,7 @@ describe('css-animation-parser', () => {
 					0% { opacity: 0; }
 					100% { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(2);
@@ -373,7 +377,7 @@ describe('css-animation-parser', () => {
 				`@keyframes fade {
 					50% { opacity: 0.5; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(1);
@@ -392,7 +396,7 @@ describe('css-animation-parser', () => {
 					50% { opacity: 0.5; }
 					100% { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(3);
@@ -421,7 +425,7 @@ describe('css-animation-parser', () => {
 					50% { opacity: 0.5; }
 					to { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(3);
@@ -451,7 +455,7 @@ describe('css-animation-parser', () => {
 					50% { translateX: 100; }
 					100% { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(3);
@@ -481,7 +485,7 @@ describe('css-animation-parser', () => {
 					from { opacity: 0; animation-timing-function: ease-in; }
 					to { opacity: 1; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(2);
@@ -498,7 +502,7 @@ describe('css-animation-parser', () => {
 					0% { opacity: 0; }
 					50% { opacity: 0.5; }
 				}`,
-				'fade'
+				'fade',
 			);

 			expect(res.length).toBe(3);
--- a/packages/core/ui/styling/css-selector.spec.ts
+++ b/packages/core/ui/styling/css-selector.spec.ts
@@ -1,4 +1,4 @@
-import { parse } from '../../css/reworkcss';
+import { parse } from '../../css/reworkcss.js';
 import { Screen } from '../../platform';
 import { createSelector, RuleSet, StyleSheetSelectorScope, fromAstNode, Node, Changes } from './css-selector';
 import { _populateRules } from './style-scope';
@@ -65,9 +65,8 @@ describe('css-selector', () => {

 		const imageQuery = selectorScope.query({ cssType: 'image', cssClasses: new Set(['login']) }).selectors;
 		expect(imageQuery.length).toBe(2);
-		// Note class before type
-		expect(imageQuery[0].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
-		expect(imageQuery[1].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+		expect(imageQuery[0].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+		expect(imageQuery[1].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
 	});

 	const positiveMatches = {
@@ -298,9 +297,8 @@ describe('css-selector', () => {

 			const { selectors: imageSelectors } = selectorScope.query({ cssType: 'image', cssClasses: new Set(['login']) });
 			expect(imageSelectors.length).toBe(2);
-			// Note class before type
-			expect(imageSelectors[0].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
-			expect(imageSelectors[1].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+			expect(imageSelectors[0].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+			expect(imageSelectors[1].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
 		});

 		it('should not apply css rules of non-matching media query', () => {
@@ -336,9 +334,8 @@ describe('css-selector', () => {

 			const { selectors: imageSelectors } = selectorScope.query({ cssType: 'image', cssClasses: new Set(['login']) });
 			expect(imageSelectors.length).toBe(2);
-			// Note class before type
-			expect(imageSelectors[0].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
-			expect(imageSelectors[1].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+			expect(imageSelectors[0].ruleset.declarations).toEqual([{ property: 'color', value: 'green' }]);
+			expect(imageSelectors[1].ruleset.declarations).toEqual([{ property: 'color', value: 'blue' }]);
 		});

 		it('should apply css rules of matching media queries but not non-matching nested media queries', () => {
--- a/packages/core/utils/native-helper.ios.ts
+++ b/packages/core/utils/native-helper.ios.ts
@@ -76,10 +76,11 @@ export function dataSerialize(data: any, wrapPrimitives: boolean = false) {
 			const node = Object.fromEntries(
 				Object.entries(data)
 					.map(([key, value]) => [key, dataSerialize(value, wrapPrimitives)])
-					.filter(([, value]) => value !== null)
+					.filter(([, value]) => value !== null),
 			);

-			return NSDictionary.dictionaryWithDictionary(node);
+			// cast to any avoids signature overload on tsc build
+			return NSDictionary.dictionaryWithDictionary(node as any);
 		}

 		default:
--- a/packages/core/vite.config.ts
+++ b/packages/core/vite.config.ts
@@ -0,0 +1,29 @@
+/// <reference types='vitest' />
+import { defineConfig } from 'vite';
+import { nxViteTsPaths } from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
+import { nxCopyAssetsPlugin } from '@nx/vite/plugins/nx-copy-assets.plugin';
+
+export default defineConfig({
+	root: __dirname,
+	cacheDir: '../../node_modules/.vite/packages/core',
+	plugins: [nxViteTsPaths(), nxCopyAssetsPlugin(['*.md'])],
+	// Uncomment this if you are using workers.
+	// worker: {
+	//  plugins: [ nxViteTsPaths() ],
+	// },
+	resolve: {
+		extensions: ['.ts', '.ios.ts'],
+	},
+	test: {
+		watch: false,
+		globals: true,
+		environment: 'node',
+		setupFiles: ['vitest.setup.ts'],
+		include: ['**/*.{test,spec}.{ts,mts}'],
+		reporters: ['default'],
+		coverage: {
+			reportsDirectory: '../../coverage/packages/core',
+			provider: 'v8',
+		},
+	},
+});
--- a/packages/core/vitest.setup.ts
+++ b/packages/core/vitest.setup.ts
@@ -1,7 +1,11 @@
 // @ts-nocheck
+// vitest.setup.ts
+import { beforeAll, afterAll, vi } from 'vitest';

-jest.mock('@nativescript/core/application', () => null, { virtual: true });
+vi.mock('@nativescript/core/application', () => null);

+// Set up global variable
+global.__UNIT_TEST__ = true;
 global.__DEV__ = true;
 global.__ANDROID__ = false;
 global.__IOS__ = true;
@@ -73,6 +77,13 @@ global.UIScreen = {
 		},
 	},
 };
+global.UIInterfaceOrientation = {
+	Unknown: 0,
+	Portrait: 1,
+	PortraitUpsideDown: 2,
+	LandscapeLeft: 4,
+	LandscapeRight: 3,
+};
 const cgColors = { CGColor: 1 };
 global.UIColor = {
 	alloc() {
@@ -245,3 +256,12 @@ global.UIContentSizeCategoryAccessibilityExtraExtraExtraLarge = 4;

 // 	willPresentActionSheet(actionSheet: UIActionSheet): void;
 // }
+
+// Example of a lifecycle hook
+beforeAll(() => {
+	console.log('Setting up tests...');
+});
+
+afterAll(() => {
+	console.log('Cleaning up after tests...');
+});
--- a/packages/core/xml/index.ts
+++ b/packages/core/xml/index.ts
@@ -2,7 +2,7 @@
 // https://github.com/NativeScript/nativescript-dev-webpack/issues/932

 import * as definition from '.';
-import { EasySAXParser } from '../js-libs/easysax';
+import { EasySAXParser } from '../js-libs/easysax/easysax.js';

 /**
 * Defines a position within string, in line and column form.
--- a/packages/webpack5/package-lock.json
+++ b/packages/webpack5/package-lock.json
--- a/packages/webpack5/package.json
+++ b/packages/webpack5/package.json
@@ -55,8 +55,8 @@
 		"webpack-virtual-modules": "^0.4.0"
 	},
 	"devDependencies": {
-		"@angular/compiler-cli": "^18.0.0",
-		"@angular-devkit/build-angular": "^18.0.0",
+		"@angular/compiler-cli": "^19.0.0",
+		"@angular-devkit/build-angular": "^19.0.0",
 		"@types/css": "0.0.33",
 		"@types/jest": "29.5.4",
 		"@types/loader-utils": "2.0.3",
@@ -69,7 +69,7 @@
 		"jest-matcher-utils": "~29.7.0",
 		"nativescript-vue-template-compiler": "2.9.3",
 		"ts-jest": "29.2.5",
-		"typescript": "~5.4.0"
+		"typescript": "~5.6.0"
 	},
 	"peerDependencies": {
 		"nativescript-vue-template-compiler": "^2.8.1"
--- a/packages/webpack5/tsconfig.json
+++ b/packages/webpack5/tsconfig.json
@@ -2,13 +2,13 @@
 	"compilerOptions": {
 		"rootDir": ".",
 		"baseUrl": ".",
-		"target": "es2017",
+		"target": "es2018",
 		"module": "commonjs",
 		"outDir": "./dist",
 		"declaration": true,
 		"emitDecoratorMetadata": true,
 		"experimentalDecorators": true,
-		"lib": ["es2017"],
+		"lib": ["es2018"],
 		"sourceMap": true,
 		"skipLibCheck": true,
 		"skipDefaultLibCheck": true,
--- a/vitest.workspace.ts
+++ b/vitest.workspace.ts
@@ -0,0 +1 @@
+export default ['**/*/vite.config.{ts,mts}', '**/*/vitest.config.{ts,mts}'];
				`@@ -0,0 +1 @@`
				`export default ['*//vite.config.{ts,mts}', '*//vitest.config.{ts,mts}'];`