Files
privacy.sexy/tests/unit/shared/Stubs/CategoryCollectionStateStub.ts
undergroundwires bf3426f91b Fix card list UI layout shifts (jumps) on load
This commit fixes layout shifts that occur on card list part of the page
when the page is initially loaded.

- Resolve issue where card list starts with minimal width, leading
  to jumps in UI until correct width is calculated on medium and
  big screens.
- Dispose of existing `ResizeObserver` properly before creating a new
  one. This prevents leaks and incorrect width calculations if
  `containerElement` changes.
- Throttle resize events to minimize width/height calculation changes,
  enhancing performance and reducing the chances for layout shifts.

Supporting CI/CD improvements:

- Enable artifact upload in CI/CD even if E2E tests fail.
- Distinguish uploaded artifacts by operating system for clarity.
2023-11-16 16:06:33 +01:00

72 lines
2.5 KiB
TypeScript

import { IApplicationCode } from '@/application/Context/State/Code/IApplicationCode';
import { IUserFilter } from '@/application/Context/State/Filter/IUserFilter';
import { ICategoryCollectionState } from '@/application/Context/State/ICategoryCollectionState';
import { OperatingSystem } from '@/domain/OperatingSystem';
import { SelectedScript } from '@/application/Context/State/Selection/SelectedScript';
import { IScript } from '@/domain/IScript';
import { ScriptStub } from '@tests/unit/shared/Stubs/ScriptStub';
import { ICategoryCollection } from '@/domain/ICategoryCollection';
import { IUserSelection } from '@/application/Context/State/Selection/IUserSelection';
import { CategoryCollectionStub } from './CategoryCollectionStub';
import { UserSelectionStub } from './UserSelectionStub';
import { UserFilterStub } from './UserFilterStub';
import { ApplicationCodeStub } from './ApplicationCodeStub';
import { CategoryStub } from './CategoryStub';
export class CategoryCollectionStateStub implements ICategoryCollectionState {
public code: IApplicationCode = new ApplicationCodeStub();
public filter: IUserFilter = new UserFilterStub();
public get os(): OperatingSystem {
return this.collection.os;
}
public collection: ICategoryCollection = new CategoryCollectionStub().withSomeActions();
public selection: IUserSelection = new UserSelectionStub([]);
constructor(readonly allScripts: IScript[] = [new ScriptStub('script-id')]) {
this.selection = new UserSelectionStub(allScripts);
this.collection = new CategoryCollectionStub()
.withOs(this.os)
.withTotalScripts(this.allScripts.length)
.withAction(new CategoryStub(0).withScripts(...allScripts));
}
public withCollection(collection: ICategoryCollection): this {
this.collection = collection;
return this;
}
public withCode(code: IApplicationCode): this {
this.code = code;
return this;
}
public withOs(os: OperatingSystem): this {
if (this.collection instanceof CategoryCollectionStub) {
this.collection = this.collection.withOs(os);
} else {
this.collection = new CategoryCollectionStub().withOs(os);
}
return this;
}
public withFilter(filter: IUserFilter): this {
this.filter = filter;
return this;
}
public withSelectedScripts(initialScripts: readonly SelectedScript[]): this {
return this.withSelection(
new UserSelectionStub([]).withSelectedScripts(initialScripts),
);
}
public withSelection(selection: IUserSelection) {
this.selection = selection;
return this;
}
}