テストとフィードバック

コンパイル結果が期待と違う、正しいコードに型エラーや lint の警告が出る、処理が遅い。 こうした問題を報告するときは、同じ現象を確かめられる再現例と、実行したコマンドを添えてください。 このページでは、再現例の作り方から報告・性能測定までを説明します。 生成コードの比較や仮想 TypeScript の調べ方は、コンパイラーインスペクターのガイドを参照してください。

プレイグラウンドで検査する

プレイグラウンドのコンパイラーインスペクターに、問題が起きる .vue ファイルを入力します。 公式 Vue SFC コンパイラーと Vize の出力を比べながら、問題に関係しない処理を少しずつ取り除いてください。 削除するたびに、同じ問題が残っていることを確かめます。

たとえば、状態の更新に関する問題なら、次のように状態とイベントだけを残したコンポーネントを出発点にできます。 これは不具合の再現例そのものではありません。問題が起きる式やディレクティブを残して、表示や出力の違いを説明してください。

<script setup lang="ts">
import { ref } from "vue";

const count = ref(0);
</script>

<template>
  <button type="button" @click="count++">{{ count }}</button>
</template>

親子コンポーネントの関係で起きる問題では、必要なファイルを一緒に残します。 再現例を絞り込めたら、同じ入力と設定を共有できるパーマリンクをコピーしてください。 DOM・SSR の切り替え、仮想 TypeScript や VIR の読み方、ローカルプロジェクトの取り込みは コンパイラーインスペクターのガイドを参照してください。

調査結果を報告する

報告先はサポートのガイドで確認できます。 報告には、次の項目をコピーして記入してください。分からない項目は、そのことを書けば構いません。

Vize / Vue のバージョン:
OS・Node.js・パッケージマネージャーのバージョン:
再現例の URL またはインスペクターのパーマリンク:
実行したコマンド、またはエディターでの操作手順:
期待する結果:
実際の結果（診断メッセージや出力を含む）:

型エラーや lint の問題では、診断全文と、指摘されたコードを一緒に載せてください。 エディターだけで起きる場合は、使っているエディターと拡張機能のバージョン、ファイルを開いてから問題が起きるまでの操作も添えます。 複数ファイルが必要なら、依存関係をインストールして同じコマンドを実行できる小さなプロジェクトを用意してください。

速度の問題には、下で説明する測定結果も添えます。 修正に参加する場合の開発環境と PR の手順は、コントリビュートのガイドを参照してください。

テストケースを読む

似た問題が既にテストされているかを調べる場合や、修正を守る回帰テストを追加する場合は、既存の入力と期待結果を参照できます。 コンパイラーの比較テストでは公式 Vue コンパイラーの出力を、型チェックの比較テストでは vue-tsc の診断を使います。 lint、フォーマッタ、SSR には、期待結果を記録したスナップショットもあります。 ほかに、多様な入力を生成するファズテストや、実際のアプリケーションを使うテストがあります。

• コンパイラーや SFC の比較用の入力とスナップショットは、tests/ と各クレートの src/snapshots/ にあります。
• 実際のアプリケーションの入力は tests/_fixtures/ にあります。Elk、Misskey、Nuxt UI、Reka UI、 VOICEVOX などを使い、操作から表示の変化までを確認します。

不足している例があれば、報告に添えてください。修正後の挙動を守るための回帰テストにできます。

パフォーマンスを測定する

型チェックが遅い場合は、対象プロジェクトで次のコマンドを実行します。

vize check --profile

実行したコマンドと出力をそのまま共有し、Vize のバージョン、プロジェクトの規模、実際にかかった時間を添えてください。 初回だけ遅いのか、繰り返しても遅いのかも分けて記録すると、調査しやすくなります。

繰り返し比較できる測定方法は型チェックのパフォーマンスで説明しています。 ローカルの開発ツールでも、構文解析、コンパイル、解析、型チェックの処理時間を確認できます。

プロジェクトをテストベッドとして提供する

保守している Vue アプリケーション、ライブラリ、フレームワーク、ツールを、テスト用のプロジェクトとして提案できます。 リポジトリの URL、ライセンス、インストールと起動に必要なコマンドに加えて、Vize で確認してほしい操作と、そのときに期待する結果を説明してください。

利用の許可があり、ライセンス上の条件も満たすプロジェクトは、操作や表示を確認するテストにできます。 継続して検証することで、同じ問題の再発を見つけやすくなります。