본문으로 건너뛰기
cccskills
무료GitHub에 공개

ios-simulator-browser

View and interact with an iOS Simulator inside the Codex browser. Display SwiftUI previews from importable Swift packages, see source edits update the running preview, and capture screenshots to document the visible results.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

원문원문 설명 보기

Mirror an iOS Simulator into the Codex in-app browser and render SwiftUI previews from importable Swift packages in that simulator with hot reload. Use when a user wants to watch or interact with an iOS app in the browser, see a SwiftUI preview outside Xcode Canvas, iterate live on a preview, or capture browser-visible simulator proof.

설치 방법 보기

이럴 때 유용합니다

  • Viewing and interacting with an iOS app in the browser
  • Checking SwiftUI previews outside Xcode Canvas
  • Iterating on package previews with hot reload
  • Capturing screenshots of simulator results

포함된 파일(7)

  • SKILL.md3.2 KB
  • agents/openai.yaml193 B
  • scripts/lib/xcode-project.mjs20.9 KB
  • scripts/swiftui-preview-browser.mjs28.0 KB
  • scripts/templates/FocusedPreviewApp.swift12.5 KB
  • scripts/templates/FocusedPreviewHotReloadRuntime.swift1.9 KB
  • scripts/templates/PreviewBrowserEntries.swift2.0 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

iOS Simulator Browser

Browser Workflow

  1. Obtain an explicit Simulator UDID from the existing iOS build/run workflow or from xcrun simctl list devices available.

  2. Start serve-sim in a long-running terminal pinned to that simulator. Clean up any tracked stale helper for this simulator before starting, and install a trap so the helper is cleaned up when this terminal exits:

    SIM="<simulator-udid>"
    cleanup_serve_sim() {
      npx --yes serve-sim@latest --kill "$SIM" >/dev/null 2>&1 || true
    }
    trap cleanup_serve_sim EXIT INT TERM HUP
    cleanup_serve_sim
    npx --yes serve-sim@latest "$SIM"
    
  3. Open the exact local preview URL printed by serve-sim in the Codex in-app browser.

  4. Verify that a real frame is rendering before reporting success. A loaded page alone is not proof that the simulator stream is healthy.

  • Keep the terminal alive while the browser mirror is in use. When finished, stop the terminal and wait for it to exit so the trap runs.
  • If the terminal disappeared or did not exit cleanly, run npx --yes serve-sim@latest --kill "$SIM" before starting another mirror for that simulator.
  • Never run an unscoped serve-sim --kill; another thread may own a different simulator mirror.

SwiftUI Preview Workflow

Use the bundled launcher when the requested previews live in an importable Swift package. Point it at the package manifest and select the target whose previews should be displayed. It generates a disposable host project outside the user's source tree, installs and launches that host in Simulator, and watches the package for edits.

node <skill-root>/scripts/swiftui-preview-browser.mjs \
  /absolute/path/to/Package.swift \
  --package-target "<target>" \
  --device "<simulator-udid>"
  • Watch mode is enabled by default. On a Swift package source edit, the launcher rebuilds a generated dylib and hot-swaps it into the running host without relaunching the app.
  • The generated host shows every preview variant discovered in the selected Swift Package target with in-simulator page controls. To show a subset instead, pass --preview-filter <regex[, ...]>; it matches display names and code identifiers such as StatusRowView_Previews.
  • Once the launcher prints the selected Simulator UDID, start serve-sim for that same UDID and open its printed URL in the in-app browser.

Support Boundary

  • Support Swift Package-backed PreviewProvider and #Preview declarations through the generated host.
  • Do not edit the user's .xcodeproj, .xcworkspace, Package.swift, schemes, or build settings to force preview support.

Proof

For browser or preview QA, capture a browser screenshot showing the simulator frame. For hot reload QA, also report the launcher's hot reloaded package preview ... in pid ... output and show the changed frame after editing.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Review charts, diagrams, and dashboards for accessibility, including color contrast, keyboard access, and text alternatives. Get specific guidance for preserving key findings in screen readers, static exports, and reduced-motion views.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Reviewing dashboard colors and keyboard access
  • Writing chart alt text and long descriptions
  • Preparing accessible figures for PDF reports
openai/plugins7.5천2026년 10월 8일 업데이트

Give a photo collection a consistent look using Adobe tools to adjust color, tone, presets, and optional crops. Review a before-and-after sample before processing the full set, then receive links to the edited images.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Giving travel photos a consistent look
  • Unifying photos taken in mixed lighting
  • Applying a warm or cinematic style across a photo set
openai/plugins7.5천2026년 10월 8일 업데이트

Visualize a logo, sketch, or design on products such as mugs, shirts, and business cards. Review a pilot image, generate a visually consistent set, and collect the results on a shareable Firefly Board.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Preview a logo on mugs and shirts
  • Turn a hand-drawn sketch into product mockups
  • Create consistent brand presentation images
openai/plugins7.5천2026년 10월 8일 업데이트

Prepare images and videos for social platforms using Adobe tools. Create image crops that keep the subject in view, expand backgrounds when available, preview a full-set sample, and resize videos while preserving their aspect ratio.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Creating image variants for multiple social platforms
  • Cropping photos for Instagram Stories
  • Preparing LinkedIn images and YouTube thumbnails
openai/plugins7.5천2026년 10월 8일 업데이트

Create flyers, social posts, business cards, and other visuals from Adobe Express templates. Choose a template, customize its text and background color, and receive a design link, with additional editing and export options depending on the available tools.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Creating an event flyer
  • Designing an Instagram post
  • Customizing business card text and colors
openai/plugins7.5천2026년 10월 8일 업데이트

Turn an uploaded video into three highlight edits with Adobe Quick Cut. Choose a target length and style, then compare versions that feature different moments and download the ones you prefer.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

  • Creating a short highlight video for social media
  • Condensing interview footage into a highlight reel
  • Comparing three edits with different moment selections
openai/plugins7.5천2026년 10월 8일 업데이트

openai의 스킬 모두 보기

이 스킬의 문제 신고