Skip to content

Add support for 'jsx' extensions#18

Merged
arunoda merged 1 commit into
storybookjs:masterfrom
minfawang:patch-1
Apr 4, 2016
Merged

Add support for 'jsx' extensions#18
arunoda merged 1 commit into
storybookjs:masterfrom
minfawang:patch-1

Conversation

@minfawang
Copy link
Copy Markdown
Contributor

It's fairly common for people having '.jsx' extensions for their react components.

It's fairly common for people having '.jsx' extensions for their react components.
loaders: [
{
test: /\.js$/,
test: /\.jsx?$/,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I hope we need to add .js as well. Does this support it as well?

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This regex will match both .js and .jsx. The ? makes the x optional.

http://regexr.com/3d4vm

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes. As said by @levithomason, this pattern optionally matches the last letter "x". So it matches both ".js" and ".jsx"

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Super. Didn't read that. Thanks guys.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Awesome!!!

@arunoda arunoda merged commit b7d2d00 into storybookjs:master Apr 4, 2016
ndelangen pushed a commit that referenced this pull request Apr 5, 2017
Ability to dock action logger in right
ndelangen pushed a commit that referenced this pull request Apr 5, 2017
Add more tests for KnobManager
ndelangen pushed a commit that referenced this pull request Apr 5, 2017
ndelangen pushed a commit that referenced this pull request Apr 5, 2017
fixes #18 : create react app public directory
ndelangen pushed a commit that referenced this pull request Apr 11, 2017
Refactor the datastore to make further improvements.
@shilman shilman added the misc label May 27, 2017
JReinhold added a commit that referenced this pull request May 31, 2023
ndelangen pushed a commit that referenced this pull request Feb 23, 2024
Implement bare minimum modal component
yannbf added a commit that referenced this pull request Apr 17, 2025
…orts

Fix use-storybook-testing-library default export handling
@nx-cloud
Copy link
Copy Markdown

nx-cloud Bot commented Jul 17, 2025

View your CI Pipeline Execution ↗ for commit 1160091

Command Status Duration Result
nx run-many -t build --parallel=3 ✅ Succeeded 1m 34s View ↗

☁️ Nx Cloud last updated this comment at 2025-09-17 20:57:36 UTC

valentinpalkovic added a commit that referenced this pull request May 12, 2026
…x-target CI, Layer-1/Layer-2 security, retry on regression, telemetry

Squash of fork-side iteration on top of the single-round v6 pivot.
Major changes since 00aa5c4:

## Verdict layering

- Three orthogonal signals: Playwright (recipe execution) + vision
  evidence-check (claude-haiku-4-5 reading the diff + spec + screenshots)
  + PR-added unit tests (vitest on *.test.* files from the PR diff).
- Final verdict gates on AND of Playwright + unit tests. Vision is
  informational (catches sr-only / invisible changes where assertions
  pass but screenshots can't confirm).
- regressionReason is derived from playwright-report.json when the
  recipe author doesn't populate one — reviewers see the failing test
  title + first error inline.

## Retry loop

- Retry-on-regression: feeds Playwright error context (page snapshot +
  iframe a11y snapshot + first error from playwright-report.json) back
  to the recipe author as --retry-context. Author re-emits the spec,
  Playwright re-runs. Single retry; final verdict gates label.
- Retry-on-evidence-undetermined: feeds vision reasoning back so the
  author can target the diff more precisely (e.g., tighter screenshot
  region).

## Sandbox-target CI path

- Recipes can set `// @verify-target: sandbox:<template>` (e.g.,
  `sandbox:vue3-vite/default-ts`). The workflow detects the header,
  runs `nx run <template>:sandbox` (NX resolves implicitDependencies,
  emits the sandbox at code/sandbox/<key>), and verify-pr.ts boots
  Storybook against that sandbox instead of the internal-ui dev server.
- Allowlisted templates: react-vite, react-webpack, vue3-vite,
  svelte-vite, angular-cli, nextjs, nextjs-vite (all default-ts).
- Skips the global `compile` target when sandbox-bound — `:sandbox`
  handles all transitive deps via the NX project graph.

## Layer-1 security: secret stripping

- pull_request_target runs build / sandbox / recipe code from the
  untrusted PR head as the runner user that holds GITHUB_TOKEN
  (contents:write, pull-requests:write) and ANTHROPIC_API_KEY.
- The Verify-PR, Retry-on-regression, and Run-PR-added-unit-tests
  steps `unset GITHUB_TOKEN GH_TOKEN ANTHROPIC_API_KEY` before
  invoking any PR-head script. Trusted scripts above
  (verify-pr-generate, verify-pr-author) still see the keys because
  env -u (or env --unset on the inner command) only strips for the
  single command.

## Layer-2 security: @anthropic-ai/sandbox-runtime jail

- Wraps `yarn verify-pr` (initial attempt + retry) in srt with a
  bubblewrap-backed FS + network jail. Defence-in-depth on top of
  Layer-1.
- network.allowLocalBinding: true (Storybook dev server on
  localhost:6006); network.allowedDomains: [] (no public-internet
  egress).
- filesystem.allowWrite: $RUNNER_TEMP, /tmp, $HOME/.cache,
  $HOME/.local/share, $HOME/.storybook.
- filesystem.denyRead: $HOME/{.ssh, .aws, .docker, .npmrc, .gitconfig,
  .config/gh} (belt-and-suspenders alongside the env stripping).
- CLAUDE_CODE_TMPDIR=$RUNNER_TEMP/sandbox-tmp so the sandbox's TMPDIR
  bind source exists on the host.

## Recipe-author quality

- Deterministic story-route derivation: scripts/verify/derive-story-
  routes.ts parses code/.storybook/main.ts via TS AST + inlines
  Storybook's auto-title / toId / storyNameFromExport algorithms.
  Routes injected into the prompt bundle verbatim — agents stop
  guessing 404 paths.
- Full source of touched non-stories files in the prompt bundle
  (capped 250 lines per file, 4 files per PR). Agents see actual
  component props / ariaLabels / data-attrs upfront.
- Iframe a11y snapshot fixture in _util.ts: on test failure, writes
  the preview-iframe's body.ariaSnapshot() to iframe-snapshot.md.
  Retry step appends this alongside the manager page-snapshot.
- Authoring guide §8.1 expanded with evidence requirement + four-step
  evidence gate + worked examples (focus-ring, Save-from-Controls
  icon swap, sr-only label gating).

## Compile-failure surfacing

- When `nx compile` fails before Playwright runs, the workflow writes
  a stub verify-result.json with verdict=regression, regressionReason=
  "compile failure", regressionDetails=tail -c 4000 of the log
  (ANSI-stripped). PR comment renders the build error in-line so
  reviewers see WHY without downloading artifacts.

## UX polish

- Vision reasoning collapsed inside a <details> block (verdict stays
  one-glance, reasoning one click away).
- PR comment unitTests block renders ✅/❌ alongside Playwright +
  vision so reviewers see all three signals together.
- Artifact zip staged under non-dot dirs so reviewers can browse it
  without toggling Finder's hidden-file display.
- Replay link points at the run-summary page (where the Artifacts
  section lives) instead of the 404-emitting /artifacts path.

## Telemetry

- New "Append telemetry" workflow step writes one CSV row per run to
  telemetry.csv on the _verify-screenshots side branch. Columns:
  run_id, pr_number, verdict, target, evidence_verdict,
  evidence_retry, unit_tests_ran, unit_tests_passed, duration_ms,
  timestamp. After 10–20 PRs the data drives v8 prioritisation
  (in-app role discovery, 2-retry budget, cross-package story
  heuristic, etc.).

## Validation

Firetest PRs (fork-side):
- #12 internal-ui smoke — verified
- #13 Save-from-Controls icon swap — verified + evidence found
- #14 ObjectControl raw JSON sr-only label — verified after retry
- #15 ArgsTable dark-mode border — regression (genuine compile-fail)
- #16 sidebar focus ring — verified, three signals positive
- #17 Vue3 page-style scoping (sandbox target) — verified + found
- #18 Svelte docgen refactor (sandbox target) — verified
- #21 Angular stats.json (sandbox target) — verified

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants