스킬 break-ui

📦

break-ui

Name: break-ui
Author: emilkowalski

콘텐츠 리비전 r1 안전 ⚙️ 외부 명령어

Stress-Test UI With Realistic Edge Cases

Demo data can hide layout failures, missing states, and incorrect formatting. This skill guides realistic fixture creation, development-only comparisons, and reports with targeted fixes.

지원: Claude Codex Code(CC)

🥉 77 브론즈

Maintain this Skill? Claim it 🥉 77 브론즈

내 에이전트로 설치

이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.

에이전트 요청

Review the Skillstore skill "break-ui" from https://skillstore.io/skills/emilkowalski-break-ui.md and its manifest at https://skillstore.io/api/skills/emilkowalski-break-ui/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.

에이전트가 읽기 쉬운 리소스

AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.

Markdown 상세 GET /skills/emilkowalski-break-ui.md 서명된 manifest GET /api/skills/emilkowalski-break-ui/manifest 서명된 lockfile GET /api/skills/emilkowalski-break-ui/lockfile

테스트해 보기

"break-ui" 사용 중입니다. Stress-test a member list with long emails and missing avatars.

예상 결과:

Illustrative finding: a long email pushes the action menu outside a narrow row, making the action unreachable.
Proposed fix: allow the text column to shrink and wrap while preserving the action width.
Design decision: wrap the full email or shorten it with access to the complete value.
What held up: the missing-avatar fallback retained its size in the tested state.

"break-ui" 사용 중입니다. Review counts and empty states in a dashboard.

예상 결과:

Illustrative finding: a count of one displays a plural label.
Proposed fix: use locale-aware pluralization and verify zero, one, and larger counts.
Illustrative finding: zero items leaves a blank content region.
Design decision: choose an empty-state message and an appropriate next action.

"break-ui" 사용 중입니다. Create data only for a project card grid.

예상 결과:

Fixture plan: spread long titles, missing images, duplicate names, and large counts across separate cards.
Comparison states: Demo, Worst case, Empty, One, and a realistic large collection.
Delivery: a development-only fixture switch, or a self-contained HTML comparison when no project exists.

보안 감사

안전

v1 • 2026. 10. 2. 버전별 보고서 열기

All 44 static findings are false positives: Markdown backticks describe UI examples, and reconnaissance matches concern layout dimensions. The quoted injection phrase warns against obeying repository instructions rather than requesting an override. No evidence found of malicious instruction overrides, credential access, data exfiltration, or executable shell payloads in the two reviewed files.

스캔된 파일

312

분석된 줄 수

검토 항목

오탐 무시됨

가장 최근에 완료된 정적·의미론적 감사에서 확인된 보안 발견 사항이 감지되지 않았습니다. 이는 스킬에 부작용이 없음을 증명하지 않습니다.

감사자: codex

이 보고서 공유 및 인용

버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.

버전별 보고서 열기

보고서 링크 복사

https://skillstore.io/skills/emilkowalski-break-ui/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 배지

[![Skillstore security assessment](https://skillstore.io/badges/skills/emilkowalski-break-ui/security.svg)](https://skillstore.io/skills/emilkowalski-break-ui?utm_source=security_passport_badge)

HTML 배지

<a href="https://skillstore.io/skills/emilkowalski-break-ui?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/emilkowalski-break-ui/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

임베드 카드

<iframe src="https://skillstore.io/embed/skills/emilkowalski-break-ui.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

학술 인용 (APA · BibTeX · CFF)

APA 인용

emilkowalski. (2026). break-ui security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/emilkowalski-break-ui/audits/1

BibTeX 인용

@techreport{emilkowalski-emilkowalski-break-ui-2026,
  author = {emilkowalski},
  title = {break-ui security audit report (audit version 1)},
  institution = {Skillstore},
  year = {2026},
  number = {1},
  url = {https://skillstore.io/skills/emilkowalski-break-ui/audits/1},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "break-ui security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
  - name: "emilkowalski"
date-released: "2026-10-02"
url: "https://skillstore.io/skills/emilkowalski-break-ui/audits/1"
identifiers:
  - type: other
    value: "skillstore:emilkowalski-break-ui:audit:1"
    description: "Skillstore immutable audit report identifier"

Skillstore 점수

이 점수의 이유 증거 신뢰도: 중간

아키텍처

유지보수성

콘텐츠

커뮤니티

사양 준수

만들 수 있는 것

Check a Component Before Release

Test member rows with long emails, short names, missing avatars, and mixed statuses before shipping.

Compare Layout Decisions

Use a fixture toggle to compare wrapping, truncation, empty states, and narrow layouts before approving design changes.

Reproduce Data-Dependent Failures

Create reusable fixtures for localization, collection boundaries, and missing data, then verify requested fixes across every state.

이 프롬프트를 사용해 보세요

Review One Component

Stress-test [component] with realistic worst-case data. Add a development-only comparison toggle and report failures before applying fixes.

Create Fixtures Only

Data only [component]. Map its fields and limits, then create demo, worst-case, empty, and single-item fixtures with a development-only toggle.

Verify Responsive and Localized States

Stress-test [screen] at its real container width, 320 pixels, and its widest supported layout. Check 200 percent zoom and supported RTL and dark mode. Separate visually verified findings from inferred findings.

Apply Selected Fixes and Recheck

Fix findings 1 and 3 from the previous report using existing project conventions. Recheck every fixture state and supported layout. Keep fixtures for regression checks and keep the toggle development-only.

모범 사례

Use plausible examples or actual validation limits, and use reserved example domains for fixture emails and URLs.
Inject fixtures at the existing data boundary and keep the comparison toggle out of production.
Review proposed fixes first, then verify approved changes against both demo and worst-case states.

피하기

Using arbitrary oversized strings instead of plausible values or schema-backed limits.
Editing markup or CSS to manufacture failures rather than changing the input data.
Stopping after long-text tests while ignoring empty lists, singular counts, missing media, and translated labels.

자주 묻는 질문

What does this skill test?

It tests realistic data boundaries, layout behavior, formatting, optional fields, media fallbacks, collection states, and supported display environments.

Does it fix problems automatically?

The default workflow reports first and stops. Explicit fix requests apply selected changes; ambiguous design decisions remain for the user.

Does it require a running application?

A project can use a development-only switch or prototype route. A standalone component can use a self-contained HTML comparison.

Can it work without browser tooling?

Yes, but it reasons from CSS rather than confirming screenshots. It must distinguish inferred findings from visually verified findings.

Should the toggle remain in production?

No. Keep it development-only or inside a prototype route, and retain fixtures for future regression checks.

Is this a complete security or accessibility audit?

No. It focuses on UI behavior under realistic data and environment stress, not comprehensive security testing or accessibility certification.

개발자 세부 정보

작성자

emilkowalski

라이선스

MIT

Skillstore 리비전

버전 안내

작성자가 버전을 선언하지 않았습니다.

리포지토리

https://github.com/emilkowalski/skills/tree/e8a175de22ae1e49370fc144c1f3bb9aeedf988d/skills/break-ui

참조

03f20c3ac209656c882df2c2afa710a6d8e08828

유지보수 최신성

2026. 10. 2.

사용량

0 다운로드 · 0 조회

파일 구조

📄 CATALOG.md

📄 SKILL.md

break-ui

내 에이전트로 설치

에이전트가 읽기 쉬운 리소스

테스트해 보기

보안 감사

위험 요인

보고서 링크 복사

Markdown 배지

HTML 배지

임베드 카드

APA 인용

BibTeX 인용

CITATION.cff

Skillstore 점수

만들 수 있는 것

Check a Component Before Release

Compare Layout Decisions

Reproduce Data-Dependent Failures

이 프롬프트를 사용해 보세요

모범 사례

피하기

자주 묻는 질문

개발자 세부 정보