traPtitech / traPtitech/Checkin
strictTemplates を迂回している v-bind のオブジェクト 8 箇所に、検査の当たらない状態が残っている
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 0
- Forks
- 0
- Avg merge
- 3d 5h
- Merged PRs (30d)
- 7
Description
現状
apps/web/nuxt.config.ts は strictTemplates: true を設定している。この設定の下では、@nuxt/ui のコンポーネントが prop として宣言していない属性をタグに直接書くと型検査が落ちる。一方、v-bind に渡したオブジェクトの中身は宣言済み prop と照合されないので、同じ属性でも v-bind 経由なら通る。
現在この書き方を使っている箇所が 8 つある。2026-09-18 に git grep -n 'v-bind=' -- 'apps/web' で数えた内訳は次のとおりで、いずれも理由を述べたコメントが直前に付いている。
apps/web/app/pages/payouts.vue:alertFallthroughAttrs(中身は{ size: 'sm' })をUAlertに渡すものが 3 箇所、{ readonly: true }をUInputに渡すものが 1 箇所、{ maxlength: 255 }をUTextareaに渡すものが 1 箇所apps/web/app/pages/special-invoice.vue:{ readonly: true }と{ inputmode: 'numeric' }をUInputに渡すものが各 1 箇所apps/web/app/pages/membership.vue:{ onClick: ... }をUCardに渡すものが 1 箇所
理由は 2 種類に分かれる。readonly・inputmode・maxlength は、UInput と UTextarea が inheritAttrs: false を設定して $attrs を内側の <input> / <textarea> へ束ねるので、コンポーネントの prop ではなく内側の要素の属性として渡す必要がある。onClick は UCard が click を emit しないため、根の要素へのフォールスルーとして渡している。
誰が何を誤るか
この 8 箇所では、属性名の綴りを間違えても型検査で出ない。v-bind のオブジェクトは宣言済み prop と照合されないので、readonly を readOnly と書いても、maxlength を maxLength と書いても通る。渡した属性が意図した要素に届いているかを確かめる手段も今は無い(.vue の描画をテストする手段がリポジトリに無いため)。
@nuxt/ui を上げたときも同じことが起きる。内側の要素への $attrs の束ね方が変われば属性は届かなくなるが、型検査もテストも失敗しないので、画面を開くまで出ない。
取りうる手
@nuxt/uiがsizeやonClickを宣言した版へ上がった時点で、UAlertとUCardの 4 箇所をタグへ直接書く形に戻す。readonly・inputmode・maxlengthは内側の要素の属性なので、この対象にはならない。なおUAlertの 3 箇所に渡しているsizeは、現在の版では宣言された prop ではないため描画に効いていない(別の issue で扱う)。- 描画のテストを用意して、8 箇所が意図した要素に属性を渡していることを検査する。
.vueのテスト手段を用意する issue に依存する。
直さずに残した理由
今の版ではタグへ直接書くと型検査が落ちるので、上流の版が変わるまで戻せない。描画の検査は、テスト手段そのものが無いところから始める必要がある。
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with apps/web/nuxt.config.ts and the eight v-bind locations listed in apps/web/app/pages/payouts.vue, special-invoice.vue, and membership.vue. Check the repository’s existing test setup and the current @nuxt/ui behavior before choosing between rendering tests and a later direct-attribute change. Done means the chosen approach verifies that the intended attributes reach the intended elements, or documents the required upstream-version change.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nuxt, typescript
- Domain
- frontend, testing
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100