Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(runtime-core): return boolean type when use defineProps to set optional boolean prop #7116

Closed
wants to merge 9 commits into from
Closed

fix(runtime-core): return boolean type when use defineProps to set optional boolean prop #7116

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
f5af09f
fix(runtime-core): return boolean type when use `defineProps` to set …
godxiaoji Nov 12, 2022
859abae
ci rebuild
godxiaoji Nov 12, 2022
054f71d
ci rebuild
godxiaoji Nov 12, 2022
151cc56
fix(runtime-core): add the judgment of default value by `withDefaults`
godxiaoji Nov 12, 2022
df5656f
fix(runtime-core): fix defaults error
godxiaoji Nov 12, 2022
2631132
test: add tests
godxiaoji Nov 12, 2022
8c750a9
chore: ci rebuild
godxiaoji Nov 15, 2022
bffb1b2
Merge branch 'vuejs:main' into fix-5847
godxiaoji Jan 12, 2023
9a9cbdd
fix(runtime-core): add boolAndUndefined conversion
godxiaoji Jan 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
36 changes: 31 additions & 5 deletions packages/runtime-core/src/apiSetupHelpers.ts
View file
Open in desktop
Expand Up @@ -58,7 +58,19 @@ export function defineProps<
PP extends ComponentObjectPropsOptions = ComponentObjectPropsOptions
>(props: PP): Readonly<ExtractPropTypes<PP>>
// overload 3: typed-based declaration
export function defineProps<TypeProps>(): Readonly<TypeProps>
// the Boolean absent props will be cast to false, so the return type
// must be a boolean type
export function defineProps<TypeProps>(): Readonly<
{
[K in keyof TypeProps as TypeProps[K] extends boolean | undefined
? K
: never]-?: TypeProps[K]
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
: never]-?: TypeProps[K]
: never]-?: NotUndefined<TypeProps[K]>

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Without NotUndefined, the '-?' will still remove 'undefined'.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actually, it won't when there's only boolean | undefined and no ?:

interface T {
  boolAndUndefined: boolean | undefined
}

type Test = {
  [K in keyof T]-?: T[K]
}
// type Test = {
//     boolAndUndefined: boolean | undefined;
// }

https://www.typescriptlang.org/play?#code/JYOwLgpgTgZghgYwgAgCrIN4ChnIEYD2BANgIIgAmAqpRDKBBQFz5HERwjIA+yArrXohGWAL5YsYAJ4AHFKggBnMMgC8mHMgDaAaWShkAawhSCMNAF0AtAH4WqXRbFYgA

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, modified.

} & {
[K in keyof TypeProps as TypeProps[K] extends boolean | undefined
? never
: K]: TypeProps[K]
}
>
// implementation
export function defineProps() {
if (__DEV__) {
Expand Down Expand Up @@ -142,13 +154,27 @@ type InferDefault<P, T> = T extends
? T | ((props: P) => T)
: (props: P) => T

type PropsWithDefaults<Base, Defaults> = Base & {
[K in keyof Defaults]: K extends keyof Base
type PropsWithDefaults<Base, Defaults> = {
[K in keyof Base as K extends keyof Defaults
? Defaults[K] extends undefined
? never
: K
: K]: Base[K];
} & {
[K in keyof Base as K extends keyof Defaults
? Defaults[K] extends undefined
? K
: never
: never]?: Base[K] | undefined;
} & Readonly<{
[K in keyof Defaults as Defaults[K] extends undefined
? never
: K]: K extends keyof Base
? Defaults[K] extends undefined
? Base[K]
: NotUndefined<Base[K]>
: never
}
: never;
}>

/**
* Vue `<script setup>` compiler macro for providing props default values when
Expand Down
8 changes: 7 additions & 1 deletion test-dts/setupHelpers.test-d.ts
View file
Open in desktop
Expand Up @@ -13,16 +13,20 @@ describe('defineProps w/ type declaration', () => {
// type declaration
const props = defineProps<{
foo: string
bool?: boolean
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider this case

      boolAndUndefined: boolean | undefined

}>()
// explicitly declared type should be refined
expectType<string>(props.foo)
// the Boolean absent props will be cast to false
expectType<boolean>(props.bool)
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This implementation will lead it cannot jump to the declaration by clicking bool of props.bool (props.foo also).

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll create a new PR with another implementation.

// @ts-expect-error
props.bar
})

describe('defineProps w/ type declaration + withDefaults', () => {
const res = withDefaults(
defineProps<{
bool?: boolean
number?: number
arr?: string[]
obj?: { x: number }
Expand All @@ -33,6 +37,7 @@ describe('defineProps w/ type declaration + withDefaults', () => {
z?: string
}>(),
{
bool: undefined,
number: 123,
arr: () => [],
obj: () => ({ x: 123 }),
Expand All @@ -53,6 +58,7 @@ describe('defineProps w/ type declaration + withDefaults', () => {
// @ts-expect-error
res.y.slice()

expectType<boolean | undefined>(res.bool)
expectType<string | undefined>(res.x)
expectType<string | undefined>(res.y)
expectType<string>(res.z)
Expand All @@ -70,7 +76,7 @@ describe('defineProps w/ union type declaration + withDefaults', () => {
union1: 123,
union2: () => [123],
union3: () => ({ x: 123 }),
union4: () => 123,
union4: () => 123
}
)
})
Expand Down