solidjs / solidjs/solid-vite-plugin

@solidjs/testing-library resolves @solidjs/web to the server build (isServer true) in jsdom tests under a multi-project vitest setup

オープン
#369 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

主要言語
TypeScript
スター
520
フォーク
70
平均マージ
23時間 35分
マージ済み PR(30日)
39

説明

Environment

  • @solidjs/vite-plugin 3.0.0-next.44
  • vitest 5.0.1, multi-project (projects), pool: threads, isolate: false
  • solid-js / @solidjs/web 2.0.0-rc.9
  • @solidjs/testing-library 1.0.0-beta.3

Reproduction

A vitest config with two projects, one jsdom ("client") and one node ("server"):

test: {
  projects: [
    { test: { name: "client", environment: "jsdom", include: ["src/**/*.test.tsx"] } },
    { test: { name: "server", environment: "node", include: ["src/server/**/*.test.ts"] } },
  ],
}

In a test file, import { isServer } from "@solidjs/web" is false (correct browser build). But inside @solidjs/testing-library's render, @solidjs/web is the server build (isServer === true), so render/hydrate behave incorrectly.

Root cause

In the client/jsdom test posture the plugin injects browser into resolve.conditions (fixing inlined modules) but leaves @solidjs/web and @solidjs/testing-library externalized — and explicitly externalizes solid-js via test.server.deps.external: [/solid-js/]. Externalized modules are executed natively by Node, whose resolution conditions are ['node', 'import', 'default'] (no browser). So @solidjs/testing-library's own import { render, hydrate } from "@solidjs/web" resolves the node export (dist/server.js).

The plugin already handles the inverse case for the node/server posture by inlining /solid-js/ + /@solidjs[+/]web/, but the client posture gets no equivalent treatment.

Workaround

Inline the runtime packages so their imports resolve through Vite's browser condition:

test: {
  server: {
    deps: {
      inline: ["solid-js", "@solidjs/web", "@solidjs/testing-library"],
    },
  },
}

(deps.inline takes precedence over deps.external.)

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

調査の方向性

まず、node/server 向けのプラグインの依存関係処理を確認し、issue に記載されている client/jsdom パスと比較します。multi-project Vitest setup を再現し、その後、workaround を必要とせずに render と hydrate が browser build を解決することを確認します。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
node.js, typescript, vite
領域
build-system, testing-qa
issue の種類
バグ
難易度
3/5
見積もり時間
1〜2日
活発さ
活発
明瞭さ
明確に書かれている
初心者へのやさしさ
68/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。