Skip to content

checkRequiredFallthroughAttributes excludes attributes inherited from a child component with props set #6100

Description

@GrantGryczan

Vue - Official extension or vue-tsc version

3.3.4

VSCode version

1.124.0

Vue version

3.5.38

TypeScript version

6.0.3

package.json dependencies

{
  "devDependencies": {
    "typescript": "^6.0.3",
    "vue": "^3.5.38",
    "vue-tsc": "^3.3.4"
  }
}

Steps to reproduce

  1. Clone the minimal reproduction linked below.
  2. Run npm i.
  3. Run npm run check, or open App.vue in VS Code with the Vue extension installed.

What is expected?

There should not be any type errors.

What is actually happening?

> vue-tsc -b --noEmit

App.vue:6:11 - error TS2353: Object literal may only specify known properties, and 'optional' does not exist in type '{ readonly style?: unknown; readonly key?: PropertyKey | undefined; readonly ref?: VNodeRef | undefined; readonly class?: unknown; readonly ref_for?: boolean | undefined; ... 6 more ...; readonly onVnodeUnmounted?: VNodeMountHook | ... 1 more ... | undefined; } & VNodeProps & AllowedComponentProps & ComponentCustomP...'.

6   <Parent optional="override" />
            ~~~~~~~~

App.vue:7:11 - error TS2353: Object literal may only specify known properties, and 'required' does not exist in type '{ readonly style?: unknown; readonly key?: PropertyKey | undefined; readonly ref?: VNodeRef | undefined; readonly class?: unknown; readonly ref_for?: boolean | undefined; ... 6 more ...; readonly onVnodeUnmounted?: VNodeMountHook | ... 1 more ... | undefined; } & VNodeProps & AllowedComponentProps & ComponentCustomP...'.

7   <Parent required="override" />
            ~~~~~~~~


Found 2 errors.

Link to minimal reproduction

https://github.com/GrantGryczan/vue-language-tools-issue

Any additional comments?

This is the same as #6082, but the issue still occurs with checkRequiredFallthroughAttributes enabled. There has been some relevant discussion in #6088. To summarize, @KazariEX commented the following against fixing this issue:

If it becomes optional and a prop with the same name is also explicitly defined, the two prop types will be merged into a union. This behavior was mentioned in #5882 (comment).

This is an artifact of the current codegen colliding with a TS quirk. It would of course be nice to avoid it, but doing so could introduce significantly more complex codegen logic and potential TS performance issues, so I chose to sidestep it.

If you still need these props to be externally overridable, define them explicitly.

I replied:

Can you not somehow use Omit<X, keyof Y> & Y, where X is the inherited props and Y is the explicit props? That way props with the same name wouldn't merge. I'm not familiar with the implementation. But at the very least, I suspect a non-asymptotic performance degradation isn't a huge concern since this is an opt-in feature, and performance was already the documented reason you wouldn't want to enable fallthroughAttributes by default in the first place.

Metadata

Metadata

Assignees

No one assigned

    Type

    Fields

    No fields configured for Bug.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions