Skip to content

Commit f220643

Browse files
rudyxu1102rudyxu1102
committed
chore: improve code
1 parent c3321f0 commit f220643

File tree

9 files changed

+172
-147
lines changed

9 files changed

+172
-147
lines changed

‎packages/dts-test/defineComponent.test-d.tsx‎

Lines changed: 64 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1044,7 +1044,7 @@ describe('inject', () => {
10441044
expectType<unknown>(this.foo)
10451045
expectType<unknown>(this.bar)
10461046
// @ts-expect-error
1047-
expectError((this.foobar = 1))
1047+
this.foobar = 1
10481048
}
10491049
})
10501050

@@ -1056,7 +1056,7 @@ describe('inject', () => {
10561056
expectType<unknown>(this.foo)
10571057
expectType<unknown>(this.bar)
10581058
// @ts-expect-error
1059-
expectError((this.foobar = 1))
1059+
this.foobar = 1
10601060
}
10611061
})
10621062

@@ -1076,7 +1076,7 @@ describe('inject', () => {
10761076
expectType<unknown>(this.foo)
10771077
expectType<unknown>(this.bar)
10781078
// @ts-expect-error
1079-
expectError((this.foobar = 1))
1079+
this.foobar = 1
10801080
}
10811081
})
10821082

@@ -1085,9 +1085,9 @@ describe('inject', () => {
10851085
props: ['a', 'b'],
10861086
created() {
10871087
// @ts-expect-error
1088-
expectError((this.foo = 1))
1088+
this.foo = 1
10891089
// @ts-expect-error
1090-
expectError((this.bar = 1))
1090+
this.bar = 1
10911091
}
10921092
})
10931093
})
@@ -1191,115 +1191,114 @@ describe('async setup', () => {
11911191

11921192
describe('define attrs', () => {
11931193
test('define attrs w/ object props', () => {
1194-
type CompAttrs = {
1195-
bar: number
1196-
baz?: string
1197-
}
11981194
const MyComp = defineComponent({
11991195
props: {
12001196
foo: String
12011197
},
1202-
attrs: Object as AttrsType<CompAttrs>,
1198+
attrs: Object as AttrsType<{
1199+
bar?: number
1200+
}>,
12031201
created() {
1204-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1205-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1202+
expectType<number | undefined>(this.$attrs.bar)
12061203
}
12071204
})
12081205
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
12091206
})
12101207

12111208
test('define attrs w/ array props', () => {
1212-
type CompAttrs = {
1213-
bar: number
1214-
baz?: string
1215-
}
12161209
const MyComp = defineComponent({
12171210
props: ['foo'],
1218-
attrs: Object as AttrsType<CompAttrs>,
1211+
attrs: Object as AttrsType<{
1212+
bar?: number
1213+
}>,
12191214
created() {
1220-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1221-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1215+
expectType<number | undefined>(this.$attrs.bar)
12221216
}
12231217
})
12241218
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
12251219
})
12261220

12271221
test('define attrs w/ no props', () => {
1228-
type CompAttrs = {
1229-
bar: number
1230-
baz?: string
1231-
}
12321222
const MyComp = defineComponent({
1233-
attrs: Object as AttrsType<CompAttrs>,
1223+
attrs: Object as AttrsType<{
1224+
bar?: number
1225+
}>,
12341226
created() {
1235-
expectType<CompAttrs['bar']>(this.$attrs.bar)
1236-
expectType<CompAttrs['baz']>(this.$attrs.baz)
1227+
expectType<number | undefined>(this.$attrs.bar)
12371228
}
12381229
})
12391230
expectType<JSX.Element>(<MyComp bar={1} />)
12401231
})
12411232

12421233
test('define attrs w/ composition api', () => {
1243-
type CompAttrs = {
1244-
bar: number
1245-
baz?: string
1246-
}
12471234
const MyComp = defineComponent({
12481235
props: {
12491236
foo: {
12501237
type: String,
12511238
required: true
12521239
}
12531240
},
1254-
attrs: Object as AttrsType<CompAttrs>,
1241+
attrs: Object as AttrsType<{
1242+
bar?: number
1243+
}>,
12551244
setup(props, { attrs }) {
12561245
expectType<string>(props.foo)
1257-
expectType<number>(attrs.bar)
1258-
expectType<string | undefined>(attrs.baz)
1246+
expectType<number | undefined>(attrs.bar)
12591247
}
12601248
})
12611249
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
12621250
})
12631251

12641252
test('define attrs w/ functional component', () => {
1265-
type CompAttrs = {
1266-
bar: number
1267-
baz?: string
1268-
}
12691253
const MyComp = defineComponent(
12701254
(props: { foo: string }, ctx) => {
1271-
expectType<number>(ctx.attrs.bar)
1272-
expectType<CompAttrs['bar']>(ctx.attrs.bar)
1273-
expectType<CompAttrs['baz']>(ctx.attrs.baz)
1255+
expectType<number | undefined>(ctx.attrs.bar)
12741256
return () => (
12751257
// return a render function (both JSX and h() works)
12761258
<div>{props.foo}</div>
12771259
)
12781260
},
12791261
{
1280-
attrs: Object as AttrsType<CompAttrs>
1262+
attrs: Object as AttrsType<{
1263+
bar?: number
1264+
}>
12811265
}
12821266
)
12831267
expectType<JSX.Element>(<MyComp foo={'1'} bar={1} />)
12841268
})
12851269

12861270
test('define attrs as low priority', () => {
1287-
type CompAttrs = {
1288-
foo: number
1289-
}
12901271
const MyComp = defineComponent({
12911272
props: {
12921273
foo: String
12931274
},
1294-
attrs: Object as AttrsType<CompAttrs>,
1275+
attrs: Object as AttrsType<{
1276+
foo?: number
1277+
}>,
12951278
created() {
12961279
// @ts-expect-error
1297-
console.log(this.$attrs.foo)
1280+
this.$attrs.foo
1281+
1282+
expectType<string | undefined>(this.foo)
12981283
}
12991284
})
13001285
expectType<JSX.Element>(<MyComp foo="1" />)
13011286
})
13021287

1288+
test('define required attrs', () => {
1289+
const MyComp = defineComponent({
1290+
attrs: Object as AttrsType<{
1291+
bar: number
1292+
}>,
1293+
created() {
1294+
expectType<number | undefined>(this.$attrs.bar)
1295+
}
1296+
})
1297+
expectType<JSX.Element>(<MyComp bar={1} />)
1298+
// @ts-expect-error
1299+
expectType<JSX.Element>(<MyComp />)
1300+
})
1301+
13031302
test('define attrs w/ no attrs', () => {
13041303
const MyComp = defineComponent({
13051304
props: {
@@ -1312,6 +1311,25 @@ describe('define attrs', () => {
13121311
// @ts-expect-error
13131312
expectType<JSX.Element>(<MyComp foo="1" bar={1} />)
13141313
})
1314+
1315+
test('default attrs like class, style', () => {
1316+
const MyComp = defineComponent({
1317+
props: {
1318+
foo: String
1319+
},
1320+
attrs: Object as AttrsType<{
1321+
bar?: number
1322+
}>,
1323+
created() {
1324+
expectType<number | undefined>(this.$attrs.bar)
1325+
expectType<unknown>(this.$attrs.class)
1326+
expectType<unknown>(this.$attrs.style)
1327+
}
1328+
})
1329+
expectType<JSX.Element>(
1330+
<MyComp class={'str'} style={'str'} foo="1" bar={1} />
1331+
)
1332+
})
13151333
})
13161334

13171335
// #5948

‎packages/dts-test/defineCustomElement.test-d.ts‎

Lines changed: 58 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ describe('inject', () => {
1515
expectType<unknown>(this.foo)
1616
expectType<unknown>(this.bar)
1717
// @ts-expect-error
18-
expectError((this.foobar = 1))
18+
this.foobar = 1
1919
}
2020
})
2121

@@ -27,7 +27,7 @@ describe('inject', () => {
2727
expectType<unknown>(this.foo)
2828
expectType<unknown>(this.bar)
2929
// @ts-expect-error
30-
expectError((this.foobar = 1))
30+
this.foobar = 1
3131
}
3232
})
3333

@@ -47,7 +47,7 @@ describe('inject', () => {
4747
expectType<unknown>(this.foo)
4848
expectType<unknown>(this.bar)
4949
// @ts-expect-error
50-
expectError((this.foobar = 1))
50+
this.foobar = 1
5151
}
5252
})
5353

@@ -56,89 +56,101 @@ describe('inject', () => {
5656
props: ['a', 'b'],
5757
created() {
5858
// @ts-expect-error
59-
expectError((this.foo = 1))
59+
this.foo = 1
6060
// @ts-expect-error
61-
expectError((this.bar = 1))
61+
this.bar = 1
6262
}
6363
})
6464
})
6565

6666
describe('define attrs', () => {
6767
test('define attrs w/ object props', () => {
68-
type CompAttrs = {
69-
bar: number
70-
baz?: string
71-
}
7268
defineCustomElement({
7369
props: {
7470
foo: String
7571
},
76-
attrs: Object as AttrsType<CompAttrs>,
72+
attrs: Object as AttrsType<{
73+
bar?: number
74+
}>,
7775
created() {
78-
expectType<number>(this.$attrs.bar)
79-
expectType<string | undefined>(this.$attrs.baz)
76+
expectType<number | undefined>(this.$attrs.bar)
8077
}
8178
})
8279
})
8380

8481
test('define attrs w/ array props', () => {
85-
type CompAttrs = {
86-
bar: number
87-
baz?: string
88-
}
8982
defineCustomElement({
9083
props: ['foo'],
91-
attrs: Object as AttrsType<CompAttrs>,
84+
attrs: Object as AttrsType<{
85+
bar?: number
86+
}>,
9287
created() {
93-
expectType<number>(this.$attrs.bar)
94-
expectType<string | undefined>(this.$attrs.baz)
88+
expectType<number | undefined>(this.$attrs.bar)
9589
}
9690
})
9791
})
9892

9993
test('define attrs w/ no props', () => {
100-
type CompAttrs = {
101-
bar: number
102-
baz?: string
103-
}
10494
defineCustomElement({
105-
attrs: Object as AttrsType<CompAttrs>,
95+
attrs: Object as AttrsType<{
96+
bar?: number
97+
}>,
10698
created() {
107-
expectType<number>(this.$attrs.bar)
108-
expectType<string | undefined>(this.$attrs.baz)
99+
expectType<number | undefined>(this.$attrs.bar)
109100
}
110101
})
111102
})
112103

113-
test('define attrs w/ function component', () => {
114-
type CompAttrs = {
115-
bar: number
116-
baz?: string
117-
}
118-
defineCustomElement(
119-
(_props: { foo: string }, ctx) => {
120-
expectType<number>(ctx.attrs.bar)
121-
expectType<number>(ctx.attrs.bar)
122-
expectType<string | undefined>(ctx.attrs.baz)
104+
test('define attrs as low priority', () => {
105+
defineCustomElement({
106+
props: {
107+
foo: String
123108
},
124-
{
125-
attrs: Object as AttrsType<CompAttrs>
109+
attrs: Object as AttrsType<{
110+
foo: number
111+
}>,
112+
created() {
113+
// @ts-expect-error
114+
this.$attrs.foo
115+
expectType<string | undefined>(this.foo)
126116
}
127-
)
117+
})
128118
})
129119

130-
test('define attrs as low priority', () => {
131-
type CompAttrs = {
132-
foo: number
133-
}
120+
test('define attrs w/ no attrs', () => {
134121
defineCustomElement({
135122
props: {
136123
foo: String
137124
},
138-
attrs: Object as AttrsType<CompAttrs>,
139125
created() {
140-
// @ts-expect-error
141-
console.log(this.$attrs.foo)
126+
expectType<unknown>(this.$attrs.bar)
127+
expectType<unknown>(this.$attrs.baz)
128+
}
129+
})
130+
})
131+
132+
test('default attrs like class, style', () => {
133+
defineCustomElement({
134+
props: {
135+
foo: String
136+
},
137+
created() {
138+
expectType<unknown>(this.$attrs.class)
139+
expectType<unknown>(this.$attrs.style)
140+
}
141+
})
142+
})
143+
144+
test('define required attrs', () => {
145+
defineCustomElement({
146+
props: {
147+
foo: String
148+
},
149+
attrs: Object as AttrsType<{
150+
bar: number
151+
}>,
152+
created() {
153+
expectType<number>(this.$attrs.bar)
142154
}
143155
})
144156
})

0 commit comments

Comments
 (0)