types(jsx): improve autocomplete type by rzzf · Pull Request #14237 · vuejs/core

rzzf · 2025-12-22T14:34:23Z

The code is sourced from DefinitelyTyped

Summary by CodeRabbit

New Features
- Improved TypeScript support for input autocomplete attributes, offering richer, more specific autocomplete options and stronger typing for billing, shipping, contact, and credential-related form fields — enhancing IDE suggestions and reducing form-related type errors.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

coderabbitai · 2025-12-22T14:34:34Z

Walkthrough

Adds multiple TypeScript type aliases describing HTML autocomplete/autofill tokens in packages/runtime-dom/src/jsx.ts and changes InputHTMLAttributes.autocomplete from string | undefined to InputAutoCompleteAttribute | undefined.

Changes

Cohort / File(s)	Change Summary
Autofill typings `packages/runtime-dom/src/jsx.ts`	Added many new type aliases for autocomplete/autofill semantics (`AutoFillAddressKind`, `AutoFillBase`, `AutoFillContactField`, `AutoFillContactKind`, `AutoFillCredentialField`, `AutoFillNormalField`, `OptionalPrefixToken`, `OptionalPostfixToken`, `AutoFillField`, `AutoFillSection`, `AutoFill`, `InputAutoCompleteAttribute`) and updated `InputHTMLAttributes.autocomplete` from `string \| undefined` to `InputAutoCompleteAttribute \| undefined`

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately describes the main change: improving the type definition for the autocomplete attribute in JSX, which aligns with adding comprehensive type aliases and updating the InputHTMLAttributes.autocomplete type.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing touches

📝 Generate docstrings

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

github-actions · 2025-12-22T14:35:18Z

Size Report

Bundles

File	Size	Gzip	Brotli
runtime-dom.global.prod.js	103 kB	39.1 kB	35.2 kB
vue.global.prod.js	161 kB	59.1 kB	52.6 kB

Usages

Name	Size	Gzip	Brotli
createApp (CAPI only)	47 kB	18.4 kB	16.8 kB
createApp	55.2 kB	21.4 kB	19.6 kB
createSSRApp	59.4 kB	23.2 kB	21.1 kB
defineCustomElement	60.7 kB	23.1 kB	21.1 kB
overall	69.5 kB	26.7 kB	24.3 kB

pkg-pr-new · 2025-12-22T14:35:32Z

Open in StackBlitz

@vue/compiler-core

pnpm add https://pkg.pr.new/@vue/compiler-core@14237

npm i https://pkg.pr.new/@vue/compiler-core@14237

yarn add https://pkg.pr.new/@vue/compiler-core@14237.tgz

@vue/compiler-dom

pnpm add https://pkg.pr.new/@vue/compiler-dom@14237

npm i https://pkg.pr.new/@vue/compiler-dom@14237

yarn add https://pkg.pr.new/@vue/compiler-dom@14237.tgz

@vue/compiler-sfc

pnpm add https://pkg.pr.new/@vue/compiler-sfc@14237

npm i https://pkg.pr.new/@vue/compiler-sfc@14237

yarn add https://pkg.pr.new/@vue/compiler-sfc@14237.tgz

@vue/compiler-ssr

pnpm add https://pkg.pr.new/@vue/compiler-ssr@14237

npm i https://pkg.pr.new/@vue/compiler-ssr@14237

yarn add https://pkg.pr.new/@vue/compiler-ssr@14237.tgz

@vue/reactivity

pnpm add https://pkg.pr.new/@vue/reactivity@14237

npm i https://pkg.pr.new/@vue/reactivity@14237

yarn add https://pkg.pr.new/@vue/reactivity@14237.tgz

@vue/runtime-core

pnpm add https://pkg.pr.new/@vue/runtime-core@14237

npm i https://pkg.pr.new/@vue/runtime-core@14237

yarn add https://pkg.pr.new/@vue/runtime-core@14237.tgz

@vue/runtime-dom

pnpm add https://pkg.pr.new/@vue/runtime-dom@14237

npm i https://pkg.pr.new/@vue/runtime-dom@14237

yarn add https://pkg.pr.new/@vue/runtime-dom@14237.tgz

@vue/server-renderer

pnpm add https://pkg.pr.new/@vue/server-renderer@14237

npm i https://pkg.pr.new/@vue/server-renderer@14237

yarn add https://pkg.pr.new/@vue/server-renderer@14237.tgz

@vue/shared

pnpm add https://pkg.pr.new/@vue/shared@14237

npm i https://pkg.pr.new/@vue/shared@14237

yarn add https://pkg.pr.new/@vue/shared@14237.tgz

vue

pnpm add https://pkg.pr.new/vue@14237

npm i https://pkg.pr.new/vue@14237

yarn add https://pkg.pr.new/vue@14237.tgz

@vue/compat

pnpm add https://pkg.pr.new/@vue/compat@14237

npm i https://pkg.pr.new/@vue/compat@14237

yarn add https://pkg.pr.new/@vue/compat@14237.tgz

commit: 6b5139d

coderabbitai

Actionable comments posted: 0

🧹 Nitpick comments (1)

packages/runtime-dom/src/jsx.ts (1)

626-629: LGTM!

The updated type provides better autocomplete suggestions while maintaining backward compatibility.

For consistency, consider applying InputAutoCompleteAttribute to other elements that support the autocomplete attribute in a follow-up PR:

FormHTMLAttributes.autocomplete (line 484)

SelectHTMLAttributes.autocomplete (line 799)

TextareaHTMLAttributes.autocomplete (line 833)

These currently use string | undefined.

📜 Review details

Configuration used: defaults

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 51fd709 and a7c5d60.

📒 Files selected for processing (1)

packages/runtime-dom/src/jsx.ts

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

GitHub Check: test / e2e-test

🔇 Additional comments (1)

packages/runtime-dom/src/jsx.ts (1)

564-624: Well-structured autocomplete type definitions following established patterns.

The type definitions correctly model the HTML autofill field names with composable template literal types. The approach mirrors the existing InputTypeHTMLAttribute pattern on lines 539-562, and the (string & {}) escape hatch ensures backward compatibility while providing autocomplete for known values.

Only exporting InputAutoCompleteAttribute while keeping intermediate types internal is the right call, as per the previous review feedback.

edison1105 · 2026-01-19T00:51:29Z

/ecosystem-ci run

vue-bot · 2026-01-19T00:55:04Z

📝 Ran ecosystem CI: Open

suite	result	latest scheduled
vuetify	❌ failure	❌ failure
router	✅ success	✅ success
test-utils	✅ success	✅ success
primevue	❌ failure	✅ success
vue-simple-compiler	✅ success	✅ success
vite-plugin-vue	✅ success	✅ success
quasar	✅ success	✅ success
vitepress	✅ success	✅ success
vueuse	❌ failure	❌ failure
vue-i18n	❌ failure	❌ failure
vue-macros	❌ failure	❌ failure
language-tools	❌ failure	❌ failure
radix-vue	✅ success	✅ success
vant	✅ success	✅ success
nuxt	❌ failure	❌ failure
pinia	✅ success	✅ success

mtorromeo · 2026-02-02T15:38:22Z

This caused some of my components which declared props with interface Props extends /* @vue-ignore */ InputHTMLAttributes to raise errors Expression produces a union type that is too complex to represent..

I could only fix this by omitting autocomplete like this: interface Props extends /* @vue-ignore */ Omit<InputHTMLAttributes, 'autocomplete'>.

In particular this is the part that's problematic:

`${OptionalPrefixToken<AutoFillSection>}${OptionalPrefixToken<AutoFillAddressKind>}${AutoFillField}${OptionalPostfixToken<AutoFillCredentialField>}`

removing the prefix tokens also makes the errors go away:

`${AutoFillField}${OptionalPostfixToken<AutoFillCredentialField>}`

rzzf · 2026-02-03T02:15:58Z

This caused some of my components which declared props with interface Props extends /* @vue-ignore */ InputHTMLAttributes to raise errors Expression produces a union type that is too complex to represent..

I could only fix this by omitting autocomplete like this: interface Props extends /* @vue-ignore */ Omit<InputHTMLAttributes, 'autocomplete'>.

In particular this is the part that's problematic:
`${OptionalPrefixToken<AutoFillSection>}${OptionalPrefixToken<AutoFillAddressKind>}${AutoFillField}${OptionalPostfixToken<AutoFillCredentialField>}`
removing the prefix tokens also makes the errors go away:
`${AutoFillField}${OptionalPostfixToken<AutoFillCredentialField>}`

Thanks for reporting this. I think it’s related to #10514 , but I’m not sure whether there’s a fix plan.

vuejs/core#14237

## [0.3.21](v0.3.20...v0.3.21) (2026-02-09) ### 🐛 Fixes #### fixed Recorder animation ([37daf6e](37daf6e)) #### workaround for @vuejs/core/14237 ([f6a27db](f6a27db)) vuejs/core#14237

types(jsx): improve autocomplete type

6b96296

edison1105 added scope: types 🍰 p2-nice-to-have Priority 2: this is not breaking anything but nice to have it addressed. ready to merge The PR is ready to be merged. labels Dec 23, 2025

KazariEX reviewed Dec 23, 2025

View reviewed changes

Comment thread packages/runtime-dom/src/jsx.ts Outdated

rzzf added 2 commits December 23, 2025 23:51

types: update

51fd709

types: export InputAutoCompleteAttribute

a7c5d60

coderabbitai Bot reviewed Dec 23, 2025

View reviewed changes

KazariEX approved these changes Dec 29, 2025

View reviewed changes

Merge branch 'main' into types/jsx-input-autocomplete

6b5139d

vuejs deleted a comment from edison1105 Jan 19, 2026

edison1105 merged commit 0596a5f into vuejs:main Jan 19, 2026
14 checks passed

rzzf deleted the types/jsx-input-autocomplete branch January 31, 2026 05:46

alanscodelog added a commit to witchcraftjs/ui that referenced this pull request Feb 9, 2026

v0fix: workaround for @vuejs/core/14237

f6a27db

vuejs/core#14237

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

types(jsx): improve autocomplete type#14237

types(jsx): improve autocomplete type#14237
edison1105 merged 4 commits intovuejs:mainfrom
rzzf:types/jsx-input-autocomplete

rzzf commented Dec 22, 2025 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Dec 22, 2025 •

edited

Loading

Uh oh!

github-actions Bot commented Dec 22, 2025

Uh oh!

pkg-pr-new Bot commented Dec 22, 2025 •

edited

Loading

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Uh oh!

edison1105 commented Jan 19, 2026

Uh oh!

vue-bot commented Jan 19, 2026

Uh oh!

Uh oh!

mtorromeo commented Feb 2, 2026

Uh oh!

rzzf commented Feb 3, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Uh oh!

Conversation

rzzf commented Dec 22, 2025 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Dec 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Pre-merge checks and finishing touches

Uh oh!

github-actions Bot commented Dec 22, 2025

Size Report

Bundles

Usages

Uh oh!

pkg-pr-new Bot commented Dec 22, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

coderabbitai Bot left a comment

Choose a reason for hiding this comment

Uh oh!

edison1105 commented Jan 19, 2026

Uh oh!

vue-bot commented Jan 19, 2026

Uh oh!

Uh oh!

mtorromeo commented Feb 2, 2026

Uh oh!

rzzf commented Feb 3, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

rzzf commented Dec 22, 2025 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Dec 22, 2025 •

edited

Loading

pkg-pr-new Bot commented Dec 22, 2025 •

edited

Loading