@taiga-ui/cdk 3.44.1 → 3.45.0-canary.1c27922

package/schematics/ng-update/v3/tests/schematic-date-time.spec.js

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+/* eslint-disable rxjs/no-topromise */
+const schematics_1 = require("@angular-devkit/schematics");
+const testing_1 = require("@angular-devkit/schematics/testing");
+const ng_morph_1 = require("ng-morph");
+const path_1 = require("path");
+const create_angular_json_1 = require("../../../utils/create-angular-json");
+const collectionPath = path_1.join(__dirname, `../../../migration.json`);
+const BEFORE = `import {Component} from '@angular/core';
+import {TuiDay, TuiMonth, TuiDayRange} from '@taiga-ui/cdk';
+
+const day = new TuiDay(0, 0, 10).formattedDay;
+
+@Component({templateUrl: './app.template.html'})
+export class AppComponent {
+    some = new TuiDay();
+    formatted = new TuiDay().formattedDay;
+
+    range = new TuiDayRange(this.some, this.some);
+    formattedRange = this.range.formattedDayRange;
+    normalized = TuiDayRange.normalizeParse(a, b, c);
+
+    other: TuiDay = getTuiDay();
+    value: TuiMonth | null = null;
+
+    show(): void {
+       const kek = this.some;
+       kek.formattedDay;
+       this.some.formattedDay;
+
+       this.other.formattedDay;
+
+       this.other.getDayFromMonthRowCol(1, 2, 3);
+
+       return this.value.formattedMonth;
+    }
+
+    dummyFn1() {
+        const {value, var1} = this;
+
+        return value.notDeprecatedProperty;
+    }
+
+    dummyFn2() {
+        const {value, var2} = this;
+    }
+}`;
+const AFTER = `import {Component} from '@angular/core';
+import {TuiDay, TuiMonth, TuiDayRange} from '@taiga-ui/cdk';
+
+const day = new TuiDay(0, 0, 10).getFormattedDay("DMY", ".");
+
+@Component({templateUrl: './app.template.html'})
+export class AppComponent {
+    some = new TuiDay();
+    formatted = new TuiDay().getFormattedDay("DMY", ".");
+
+    range = new TuiDayRange(this.some, this.some);
+    formattedRange = this.range.getFormattedDayRange("DMY", ".");
+    normalized = TuiDayRange.normalizeParse(a, "DMY");
+
+    other: TuiDay = getTuiDay();
+    value: TuiMonth | null = null;
+
+    show(): void {
+       const kek = this.some;
+       kek.getFormattedDay("DMY", ".");
+       this.some.getFormattedDay("DMY", ".");
+
+       this.other.getFormattedDay("DMY", ".");
+
+// TODO: (Taiga UI migration) getDayFromMonthRowCol has been removed in 3.0. If you need this utils check out this pipe https://github.com/taiga-family/taiga-ui/tree/main/projects/core/pipes/calendar-sheet
+       this.other.getDayFromMonthRowCol(1, 2, 3);
+
+// TODO: (Taiga UI migration) formattedMonth has been removed in 3.0. Please use TUI_MONTH_FORMATTER from @taiga-ui/kit
+       return this.value.formattedMonth;
+    }
+
+    dummyFn1() {
+        const {value, var1} = this;
+
+        return value.notDeprecatedProperty;
+    }
+
+    dummyFn2() {
+        const {value, var2} = this;
+    }
+}`;
+describe(`ng-update`, () => {
+    let host;
+    let runner;
+    beforeEach(() => {
+        host = new testing_1.UnitTestTree(new schematics_1.HostTree());
+        runner = new testing_1.SchematicTestRunner(`schematics`, collectionPath);
+        ng_morph_1.setActiveProject(ng_morph_1.createProject(host));
+        createMainFiles();
+        ng_morph_1.saveActiveProject();
+    });
+    it(`date-time migrations`, () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        const tree = yield runner
+            .runSchematicAsync(`updateToV3`, { 'skip-logs': process.env[`TUI_CI`] === `true` }, host)
+            .toPromise();
+        expect(tree.readContent(`test/app/app.component.ts`)).toEqual(AFTER);
+    }));
+    afterEach(() => {
+        ng_morph_1.resetActiveProject();
+    });
+});
+function createMainFiles() {
+    ng_morph_1.createSourceFile(`test/app/app.component.ts`, BEFORE);
+    ng_morph_1.createSourceFile(`test/app/mock.ts`, `export class TuiDay {}`);
+    ng_morph_1.createSourceFile(`test/app/app.template.html`, `<app></app>`);
+    create_angular_json_1.createAngularJson();
+    ng_morph_1.createSourceFile(`package.json`, `{"dependencies": {"@angular/core": "~13.0.0"}}`);
+}

package/schematics/ng-update/v3/tests/schematic-migrate-hints.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/schematics/ng-update/v3/tests/schematic-migrate-hints.spec.js

@@ -0,0 +1,102 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+/* eslint-disable rxjs/no-topromise */
+const schematics_1 = require("@angular-devkit/schematics");
+const testing_1 = require("@angular-devkit/schematics/testing");
+const ng_morph_1 = require("ng-morph");
+const path_1 = require("path");
+const create_angular_json_1 = require("../../../utils/create-angular-json");
+const collectionPath = path_1.join(__dirname, `../../../migration.json`);
+const COMPONENT_WITH_TEMPLATE_URL = `
+@Component({templateUrl: './test.template.html'})
+export class TestComponent {}
+`;
+const TEMPLATE_BEFORE = `
+<button
+    tuiButton
+    tuiHintDirection="bottom-middle"
+    tuiHintMode="onDark"
+    tuiPointerHint="Wow! How exciting!"
+></button>
+
+<button
+    tuiButton
+    type="button"
+    [tuiManualHint]="template"
+    [tuiManualHintShow]="hintShown"
+    (click)="toggleHint()"
+>
+    Hint
+</button>
+
+<tui-bar-chart
+    class="chart"
+    [value]="value"
+    [hintContent]="hint"
+    [hintMode]="appearance"
+></tui-bar-chart>
+
+<tui-tooltip
+      describeId="example3"
+      mode="onDark"
+      content="some tooltip content"
+></tui-tooltip>
+`;
+const TEMPLATE_AFTER = `
+<button
+    tuiButton
+    tuiHintDirection="bottom"
+    tuiHintAppearance="onDark"
+    tuiHintPointer tuiHint="Wow! How exciting!"
+></button>
+
+<button
+    tuiButton
+    type="button"
+    [tuiHint]="template"
+    [tuiHintManual]="hintShown"
+    (click)="toggleHint()"
+>
+    Hint
+</button>
+
+<tui-bar-chart
+    class="chart"
+    [value]="value"
+    [tuiHintContent]="hint"
+    [tuiHintAppearance]="appearance"
+></tui-bar-chart>
+
+<tui-tooltip
+      describeId="example3"
+      appearance="onDark"
+      content="some tooltip content"
+></tui-tooltip>
+`;
+describe(`ng-update`, () => {
+    let host;
+    let runner;
+    beforeEach(() => {
+        host = new testing_1.UnitTestTree(new schematics_1.HostTree());
+        runner = new testing_1.SchematicTestRunner(`schematics`, collectionPath);
+        ng_morph_1.setActiveProject(ng_morph_1.createProject(host));
+        createMainFiles();
+        ng_morph_1.saveActiveProject();
+    });
+    it(`should migrate polymorpheus`, () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        const tree = yield runner
+            .runSchematicAsync(`updateToV3`, { 'skip-logs': process.env[`TUI_CI`] === `true` }, host)
+            .toPromise();
+        expect(tree.readContent(`test/app/test.template.html`)).toEqual(TEMPLATE_AFTER);
+    }));
+    afterEach(() => {
+        ng_morph_1.resetActiveProject();
+    });
+});
+function createMainFiles() {
+    ng_morph_1.createSourceFile(`test/app/test.component.ts`, COMPONENT_WITH_TEMPLATE_URL);
+    ng_morph_1.createSourceFile(`test/app/test.template.html`, TEMPLATE_BEFORE);
+    create_angular_json_1.createAngularJson();
+    ng_morph_1.createSourceFile(`package.json`, `{"dependencies": {"@angular/core": "~13.0.0"}}`);
+}

package/schematics/ng-update/v3/tests/schematic-migrate-polymorpheus.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/schematics/ng-update/v3/tests/schematic-migrate-polymorpheus.spec.js

@@ -0,0 +1,107 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+/* eslint-disable rxjs/no-topromise */
+const schematics_1 = require("@angular-devkit/schematics");
+const testing_1 = require("@angular-devkit/schematics/testing");
+const ng_morph_1 = require("ng-morph");
+const path_1 = require("path");
+const create_angular_json_1 = require("../../../utils/create-angular-json");
+const collectionPath = path_1.join(__dirname, `../../../migration.json`);
+const COMPONENT_WITH_TEMPLATE_URL = `
+@Component({templateUrl: './test.template.html'})
+export class TestComponent {}
+`;
+const TEMPLATE_BEFORE = `
+<div
+    polymorpheus-outlet
+    [content]="content"
+    [context]="myContext"
+></div>
+
+<div
+    polymorpheus-outlet
+    [content]="content"
+    [context]="context"
+>
+    <ng-template let-hapicaCamelCase>
+        <div>{{ hapicaCamelCase }}</div>
+    </ng-template>
+</div>
+
+<div
+    *ngIf="icon"
+    polymorpheus-outlet
+    class="t-icon-outlet"
+    [content]="icon"
+>
+    <ng-template let-icon>
+        <tui-svg
+            automation-id="tui-input-card-grouped__icon"
+            class="t-card"
+            [src]="icon"
+        ></tui-svg>
+    </ng-template>
+</div>
+`;
+const TEMPLATE_AFTER = `
+<div
+    ${``}
+    ${``}
+    ${``}
+>
+<ng-container *polymorpheusOutlet="content as text; context: myContext">
+    {{ text }}
+</ng-container></div>
+
+<div
+    ${``}
+    ${``}
+    ${``}
+>
+    <ng-container *polymorpheusOutlet="content as hapicaCamelCase; context: context" >
+        <div>{{ hapicaCamelCase }}</div>
+    </ng-container>
+</div>
+
+<div
+    *ngIf="icon"
+    ${``}
+    class="t-icon-outlet"
+    ${``}
+>
+    <ng-container *polymorpheusOutlet="icon as icon" >
+        <tui-svg
+            automation-id="tui-input-card-grouped__icon"
+            class="t-card"
+            [src]="icon"
+        ></tui-svg>
+    </ng-container>
+</div>
+`;
+describe(`ng-update`, () => {
+    let host;
+    let runner;
+    beforeEach(() => {
+        host = new testing_1.UnitTestTree(new schematics_1.HostTree());
+        runner = new testing_1.SchematicTestRunner(`schematics`, collectionPath);
+        ng_morph_1.setActiveProject(ng_morph_1.createProject(host));
+        createMainFiles();
+        ng_morph_1.saveActiveProject();
+    });
+    it(`should migrate polymorpheus`, () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+        const tree = yield runner
+            .runSchematicAsync(`updateToV3`, { 'skip-logs': process.env[`TUI_CI`] === `true` }, host)
+            .toPromise();
+        expect(tree.readContent(`test/app/test.template.html`)).toEqual(TEMPLATE_AFTER);
+    }));
+    afterEach(() => {
+        ng_morph_1.resetActiveProject();
+    });
+});
+function createMainFiles() {
+    ng_morph_1.createSourceFile(`test/app/test.component.ts`, COMPONENT_WITH_TEMPLATE_URL);
+    ng_morph_1.createSourceFile(`test/app/test.template.html`, TEMPLATE_BEFORE);
+    create_angular_json_1.createAngularJson();
+    ng_morph_1.createSourceFile(`package.json`, `{"dependencies": {"@angular/core": "~13.0.0"}}`);
+}

package/schematics/ng-update/v3/tests/schematic-migrate-progress.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/schematics/ng-update/v3/tests/schematic-migrate-progress.spec.js

@@ -0,0 +1,113 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+/* eslint-disable rxjs/no-topromise */
+const schematics_1 = require("@angular-devkit/schematics");
+const testing_1 = require("@angular-devkit/schematics/testing");
+const ng_morph_1 = require("ng-morph");
+const path_1 = require("path");
+const create_angular_json_1 = require("../../../utils/create-angular-json");
+const migrate_progress_1 = require("../steps/migrate-progress");
+const collectionPath = path_1.join(__dirname, `../../../migration.json`);
+const APP_COMPONENT = `
+@Component({templateUrl: './app.template.html'})
+export class AppComponent {
+    readonly complexGradient = 'linear-gradient(to right, var(--tui-support-02), var(--tui-support-14), var(--tui-support-12))';
+}
+`;
+const TEMPLATE_BEFORE = `
+<progress
+    tuiProgressBar
+    class="progress"
+    [value]="slowValue$ | async"
+    [max]="colors.length"
+    [color]="colors | tuiProgressColorSegments"
+></progress>
+
+<progress tuiProgressBar [max]="100" [value]="40" [color]="colors | tuiProgressColorSegmentsAsync | async"></progress>
+
+<progress
+    tuiProgressBar
+    max="100"
+    [color]="complexGradient"
+    [value]="fastValue$ | async"
+></progress>
+
+<progress
+    tuiProgressBar
+    [tuiProgressColorSegments]="colors"
+    [value]="fastValue$ | async"
+></progress>
+`;
+const TEMPLATE_AFTER = `
+<progress
+    tuiProgressBar
+    class="progress"
+    [value]="slowValue$ | async"
+    [max]="colors.length"
+    [tuiProgressColorSegments]="colors"
+></progress>
+
+<progress tuiProgressBar [max]="100" [value]="40" [tuiProgressColorSegments]="colors"></progress>
+
+<progress
+    tuiProgressBar
+    max="100"
+    [color]="complexGradient"
+    [value]="fastValue$ | async"
+></progress>
+
+<progress
+    tuiProgressBar
+    [tuiProgressColorSegments]="colors"
+    [value]="fastValue$ | async"
+></progress>
+`;
+describe(`migrate progress`, () => {
+    let host;
+    let runner;
+    beforeEach(() => {
+        host = new testing_1.UnitTestTree(new schematics_1.HostTree());
+        runner = new testing_1.SchematicTestRunner(`schematics`, collectionPath);
+        ng_morph_1.setActiveProject(ng_morph_1.createProject(host));
+        createMainFiles();
+        ng_morph_1.saveActiveProject();
+    });
+    describe(`migration works`, () => {
+        it(`html`, () => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+            const tree = yield runner
+                .runSchematicAsync(`updateToV3`, { 'skip-logs': process.env[`TUI_CI`] === `true` }, host)
+                .toPromise();
+            expect(tree.readContent(`test/app-with-progress/app.template.html`)).toBe(TEMPLATE_AFTER);
+        }));
+    });
+    describe(`DEPRECATED_PROGRESS_PIPES_REG`, () => {
+        it(`colors | tuiProgressColorSegments`, () => {
+            expect(`[tuiProgressColorSegments]="colors | tuiProgressColorSegments"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors"`);
+        });
+        it(`colors|tuiProgressColorSegments`, () => {
+            expect(`[tuiProgressColorSegments]="colors|tuiProgressColorSegments"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors"`);
+        });
+        it(`colors | tuiProgressColorSegments | customPipe`, () => {
+            expect(`[tuiProgressColorSegments]="colors | customPipe | tuiProgressColorSegments"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors | customPipe"`);
+        });
+        it(`colors | tuiProgressColorSegmentsAsync | async`, () => {
+            expect(`[tuiProgressColorSegments]="colors | tuiProgressColorSegmentsAsync | async"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors"`);
+        });
+        it(`colors|tuiProgressColorSegmentsAsync|async`, () => {
+            expect(`[tuiProgressColorSegments]="colors | tuiProgressColorSegmentsAsync | async"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors"`);
+        });
+        it(`colors | customPipe | tuiProgressColorSegmentsAsync | async`, () => {
+            expect(`[tuiProgressColorSegments]="colors | customPipe | tuiProgressColorSegmentsAsync | async"`.replace(migrate_progress_1.DEPRECATED_PROGRESS_PIPES_REG, ``)).toBe(`[tuiProgressColorSegments]="colors | customPipe"`);
+        });
+    });
+    afterEach(() => {
+        ng_morph_1.resetActiveProject();
+    });
+});
+function createMainFiles() {
+    ng_morph_1.createSourceFile(`test/app-with-progress/app.component.ts`, APP_COMPONENT);
+    ng_morph_1.createSourceFile(`test/app-with-progress/app.template.html`, TEMPLATE_BEFORE);
+    create_angular_json_1.createAngularJson();
+    ng_morph_1.createSourceFile(`package.json`, `{"dependencies": {"@angular/core": "~13.0.0"}}`);
+}

package/schematics/ng-update/v3/tests/schematic-migrate-sliders.spec.d.ts

@@ -0,0 +1 @@
+export {};