Break UI

emilkowalski/skills

Stress-test UI components with realistic edge-case data and a switchable worst-case fixture.

Материал обновлён:

В коллекцииEmil Kowalski Design Skills ↗
Открыть на GitHub
npx skills add emilkowalski/skills --skill break-ui
56 965Звёзды3 336ФоркиПоследний push репозитория

Install and use Break UI

  1. Install the Skill

    Run the upstream command in your project, then follow the author’s setup guide and any requirements below.

    npx skills add emilkowalski/skills --skill break-ui
  2. Give your agent a task

    Provide the relevant files, context and constraints. For example:

    Stress-test this component with long names, missing fields and unusual numbers; show the failures before changing it.

Об этом Skill

Stress-test UI components with realistic edge-case data and a switchable worst-case fixture.

Почему мы его выбрали

Focuses on long text, missing fields, unusual names and number formats, then reports concrete breakages.

Для каких задач подходит

  • Test how a component behaves with unusual content before choosing fixes.

Scope and limitations

The workflow creates a development-only fixture and reports breaks; fixes follow the user’s selection. Existing Impeccable also checks edge cases, while this task centers on a switchable worst-case dataset.

Alternatives and related workflows

Impeccable: broader UI hardening

Impeccable’s harden workflow also addresses long text, localization and errors. Choose Break UI for its switchable worst-case fixture; choose Impeccable for the broader interface workflow.

Перед использованием

  • A coding agent with access to the interface project and a safe development preview.

Источники и материалы

Ссылки на оригинальные материалы приведены ниже. Практические идеи предложены редакцией SkillHey.