🐞 - v3 to v4 migration errors

[dequubi]

Reproduction url

N/A

Description

• Было бы неплохо, если бы миграция не меняла line separator'ы с CRLF на LF

---

• tui-data-list-wrapper перестал принимать size="xs", миграция не заменила "s" или не написала комментарий

---

• В ситуации [tuiHint]="[] | tuiFieldErrorContent" в компонент не импортировался TuiFieldErrorContentPipe, остался TuiFieldErrorPipe

---

• tui-input-tag

<tui-input-tag formControlName="values"
       [uniqueTags]="false"
       [tuiHint]="valueArray.length > 0 ? editableHintTpl : ''"
       tuiHintAppearance="onDark"
       tuiHintDirection="bottom"
       [expandable]="false"
/>

Мигрировало как

<tui-input-tag formControlName="values"
     [uniqueTags]="false"
     [tuiHint]="valueArray.length > 0 ? editableHintTpl : ''"
     tuiHintAppearance="dark"
     tuiHintDirection="bottom"

/[rows]="1">

---

• tuiScrollable не импортируется в компонент, TuiScrollbarModule заменяется на TuiScrollbar

---

• TuiTablePaginationEvent

public onPaginationChange(paginationChange: TuiTablePagination) { /* ... */ }

TuiTablePagination не заменился на TuiTablePaginationEvent

---

• На <a tuiIconButton/tuiButton> больше нельзя навесить [disabled]

---

• tui-checkbox-labeled

<tui-checkbox-labeled [ngModel]="selectAllChecked()"
                      (ngModelChange)="onSelectAllChange($event)"
                      [nullableBool]="nullableBool"
>
    {{ 'shared.filterCheckbox.selectAll' | transloco }}
</tui-checkbox-labeled>

Мигрировался как

<label tuiLabel><label tuiLabel> <input tuiCheckbox type="checkbox" [ngModel]="selectAllChecked()"
                  (ngModelChange)="onSelectAllChange($event)"
                  [nullableBool]="nullableBool"
>
    {{ 'shared.filterCheckbox.selectAll' | transloco }}
</label>

(два label)

---

• tui-checkbox-block

<tui-checkbox-block [formControl]="control"
    [size]="size"
>
    {{ label() }}
</tui-checkbox-block>

Мигрировался как

<label tuiBlock="size"> <input tuiCheckbox type="checkbox" [formControl]="control"           
    [size]="size"
>
    {{ label() }}
</label>

(потерялись квадратные скобки у tuiBlock="size")

---

• Остался импорт TuiStepState из kit, когда этот тип вообще был удален

---

• Импорт TUI_TEXTFIELD_SIZE остается из core, а не из legacy

---

• Импорт TuiStatus, TUI_ARROW_MODE, TuiComboboxComponent, TuiSelectComponent остается из kit, а не из legacy

---

• В tui-badged-content

[colorTop]="(unsavedChanges.value$ | async) ? 'var(--tui-warning-fill)' : ''"

Мигрировался как

[style.color]="'(unsavedChanges.value$ | async) ? 'var(--tui-status-warning)' : '''"

(некорректно поставлены кавычки)

---

• В tui-badged-content внутрь вставился tui-badge-notification, но TuiBadgeNotification не импортировался в компонент

---

• В main.ts уже был запровайден NG_EVENT_PLUGINS со старым импортом

import { NG_EVENT_PLUGINS } from '@tinkoff/ng-event-plugins';

Он поправился, на

import { NG_EVENT_PLUGINS } from '@taiga-ui/event-plugins';

но добавился идентичный дубль вверх файла, и дубль в провайдеры

---

• tui-svg в [src] мог принять undefined, tui-icon в [icon] не может, из-за чего все места, где в tui-svg мог попасть undefined, стали ошибкой после миграции

---

• В tui-primitive-textfield (который из легаси) [pseudoFocus] некорректно заменился на [tuiAppearanceFocus]

---

• TuiTreeItemContentComponent не заменен на TuiTreeItemContent

---

• Перестает работать кейс

<tui-hosted-dropdown #ref>
  ...
  <button (click)="ref.close()"></button>
  ...
</tui-hosted-dropdown>

Нужно пользоваться exportAs у tuiDropdown и дергать .toggle(false)

---

• TuiResizerModule не заменился на TuiResizer + TuiResizable.
  Директива tuiResizeable не переименовалась в темплейте на tuiResizable.

---

• tui-badge перестал принимать "xs" размер, аналогичная ситуация с tui-data-list-wrapper

Taiga UI version

3.94.0 -> 4.18.0

Browser Used

Chrome

OS Used

Windows

[dequubi]

• Fixed

В main.ts в провайдерах было

importProvidersFrom(TuiEdtiorModule)

Некорректно заменило на

importProvidersFrom(TuiEditor, TuiEditorSocket)

[dequubi]

• Иконка tuiIconAddRowLarge мигрировала как @tui.add-row, но такой иконки не существует.
  tuiIconColumns мигрировало как @tui.columns, но должно быть @tui.columns-2.
  tuiIconTool мигрировало как @tui.tool, но должно быть @tui.wrench.
  tuiIconCheckSquare мигрировало как @tui.check-square, но должно быть @tui.square-check-big.

[splincode]

tui-svg в [src] мог принять undefined, tui-icon в [icon] не может, из-за чего все места, где в tui-svg мог попасть undefined, стали ошибкой после миграции

The team said there was nothing to do about it, expected behavior

[hakimio]

One more:

• tuiGenerateRoutes() is removed without any explanation. The migrator should at least indicate that it was replaced by tuiProvideRoutePageTab().

[splincode]

@dequubi
I can't reproduce it, can you please send full template?

[dequubi]

@splincode

@if (showSearch()) {
    <div class="mb-0_5">
        <tui-input tuiTextfieldSize="s"
                   [ngModel]="searchValue()"
                   (ngModelChange)="searchValue.set($event)"
        >
            {{ 'shared.filterCheckbox.search' | transloco }}
        </tui-input>
    </div>
}
@if (showSelectAll()) {
    <tui-checkbox-labeled [ngModel]="selectAllChecked()"
                          (ngModelChange)="onSelectAllChange($event)"
                          [nullableBool]="nullableBool"
    >
        {{ 'shared.filterCheckbox.selectAll' | transloco }}
    </tui-checkbox-labeled>
    <hr class="my-0_5">
}
<tui-scrollbar>
    <div class="checkbox-container">
        @for (option of filteredOptions(); track option.key) {
            <tui-checkbox-labeled [(ngModel)]="selectedOptions()[option.key]"
                                  (ngModelChange)="onOptionChange()"
                                  [nullableBool]="nullableBool"
            >
                {{ option.value }}
            </tui-checkbox-labeled>
        }
    </div>
</tui-scrollbar>

[splincode]

I don't see any problem after migration

maybe already fixed in main

@vladimirpotekhin what do you think?

[dequubi]

Weird, I was able to reproduce it

[vladimirpotekhin]

@vladimirpotekhin what do you think?

I also can't reproduce this on macos. I suspect it might be related to windows

@dequubi what is the encoding of your files? UTF-8 / UTF-8 with BOM, or something else ?

[dequubi]

@vladimirpotekhin UTF-8. I can send you the whole file if that helps.

filter-checkbox-array.component.html.zip

[waterplea]

I think that's not worth the effort anymore, migration scripts are inevitably error-prone and the more time we spend on perfecting them – the less time is left to do the other work. This looks good enough for me at this point to resolve it. Thank you everyone!