+435
-371
lines changedFilter options
+435
-371
lines changed Original file line number Diff line number Diff line change
@@ -1066,6 +1066,188 @@ describe('api: options', () => {
1066 1066
)
1067 1067
})
1068 1068 1069 +
describe('options merge strategies', () => {
1070 +
test('this.$options.data', () => {
1071 +
const mixin = {
1072 +
data() {
1073 +
return { foo: 1, bar: 2 }
1074 +
}
1075 +
}
1076 +
createApp({
1077 +
mixins: [mixin],
1078 +
data() {
1079 +
return {
1080 +
foo: 3,
1081 +
baz: 4
1082 +
}
1083 +
},
1084 +
created() {
1085 +
expect(this.$options.data).toBeInstanceOf(Function)
1086 +
expect(this.$options.data()).toEqual({
1087 +
foo: 3,
1088 +
bar: 2,
1089 +
baz: 4
1090 +
})
1091 +
},
1092 +
render: () => null
1093 +
}).mount(nodeOps.createElement('div'))
1094 +
})
1095 + 1096 +
test('this.$options.inject', () => {
1097 +
const mixin = {
1098 +
inject: ['a']
1099 +
}
1100 +
const app = createApp({
1101 +
mixins: [mixin],
1102 +
inject: { b: 'b', c: { from: 'd' } },
1103 +
created() {
1104 +
expect(this.$options.inject.a).toEqual('a')
1105 +
expect(this.$options.inject.b).toEqual('b')
1106 +
expect(this.$options.inject.c).toEqual({ from: 'd' })
1107 +
expect(this.a).toBe(1)
1108 +
expect(this.b).toBe(2)
1109 +
expect(this.c).toBe(3)
1110 +
},
1111 +
render: () => null
1112 +
})
1113 + 1114 +
app.provide('a', 1)
1115 +
app.provide('b', 2)
1116 +
app.provide('d', 3)
1117 +
app.mount(nodeOps.createElement('div'))
1118 +
})
1119 + 1120 +
test('this.$options.provide', () => {
1121 +
const mixin = {
1122 +
provide: {
1123 +
a: 1
1124 +
}
1125 +
}
1126 +
createApp({
1127 +
mixins: [mixin],
1128 +
provide() {
1129 +
return {
1130 +
b: 2
1131 +
}
1132 +
},
1133 +
created() {
1134 +
expect(this.$options.provide).toBeInstanceOf(Function)
1135 +
expect(this.$options.provide()).toEqual({ a: 1, b: 2 })
1136 +
},
1137 +
render: () => null
1138 +
}).mount(nodeOps.createElement('div'))
1139 +
})
1140 + 1141 +
test('this.$options[lifecycle-name]', () => {
1142 +
const mixin = {
1143 +
mounted() {}
1144 +
}
1145 +
createApp({
1146 +
mixins: [mixin],
1147 +
mounted() {},
1148 +
created() {
1149 +
expect(this.$options.mounted).toBeInstanceOf(Array)
1150 +
expect(this.$options.mounted.length).toBe(2)
1151 +
},
1152 +
render: () => null
1153 +
}).mount(nodeOps.createElement('div'))
1154 +
})
1155 + 1156 +
test('this.$options[asset-name]', () => {
1157 +
const mixin = {
1158 +
components: {
1159 +
a: {}
1160 +
},
1161 +
directives: {
1162 +
d1: {}
1163 +
}
1164 +
}
1165 +
createApp({
1166 +
mixins: [mixin],
1167 +
components: {
1168 +
b: {}
1169 +
},
1170 +
directives: {
1171 +
d2: {}
1172 +
},
1173 +
created() {
1174 +
expect('a' in this.$options.components).toBe(true)
1175 +
expect('b' in this.$options.components).toBe(true)
1176 +
expect('d1' in this.$options.directives).toBe(true)
1177 +
expect('d2' in this.$options.directives).toBe(true)
1178 +
},
1179 +
render: () => null
1180 +
}).mount(nodeOps.createElement('div'))
1181 +
})
1182 + 1183 +
test('this.$options.methods', () => {
1184 +
const mixin = {
1185 +
methods: {
1186 +
fn1() {}
1187 +
}
1188 +
}
1189 +
createApp({
1190 +
mixins: [mixin],
1191 +
methods: {
1192 +
fn2() {}
1193 +
},
1194 +
created() {
1195 +
expect(this.$options.methods.fn1).toBeInstanceOf(Function)
1196 +
expect(this.$options.methods.fn2).toBeInstanceOf(Function)
1197 +
},
1198 +
render: () => null
1199 +
}).mount(nodeOps.createElement('div'))
1200 +
})
1201 + 1202 +
test('this.$options.computed', () => {
1203 +
const mixin = {
1204 +
computed: {
1205 +
c1() {}
1206 +
}
1207 +
}
1208 +
createApp({
1209 +
mixins: [mixin],
1210 +
computed: {
1211 +
c2() {}
1212 +
},
1213 +
created() {
1214 +
expect(this.$options.computed.c1).toBeInstanceOf(Function)
1215 +
expect(this.$options.computed.c2).toBeInstanceOf(Function)
1216 +
},
1217 +
render: () => null
1218 +
}).mount(nodeOps.createElement('div'))
1219 +
})
1220 + 1221 +
// #2791
1222 +
test('modify $options in the beforeCreate hook', async () => {
1223 +
const count = ref(0)
1224 +
const mixin = {
1225 +
data() {
1226 +
return { foo: 1 }
1227 +
},
1228 +
beforeCreate(this: any) {
1229 +
if (!this.$options.computed) {
1230 +
this.$options.computed = {}
1231 +
}
1232 +
this.$options.computed.value = () => count.value
1233 +
}
1234 +
}
1235 +
const root = nodeOps.createElement('div')
1236 +
createApp({
1237 +
mixins: [mixin],
1238 +
render(this: any) {
1239 +
return this.value
1240 +
}
1241 +
}).mount(root)
1242 + 1243 +
expect(serializeInner(root)).toBe('0')
1244 + 1245 +
count.value++
1246 +
await nextTick()
1247 +
expect(serializeInner(root)).toBe('1')
1248 +
})
1249 +
})
1250 + 1069 1251
describe('warnings', () => {
1070 1252
test('Expected a function as watch handler', () => {
1071 1253
const Comp = {
@@ -4,7 +4,11 @@ import {
4 4
validateComponentName,
5 5
Component
6 6
} from './component'
7 -
import { ComponentOptions, RuntimeCompilerOptions } from './componentOptions'
7 +
import {
8 +
ComponentOptions,
9 +
MergedComponentOptions,
10 +
RuntimeCompilerOptions
11 +
} from './componentOptions'
8 12
import { ComponentPublicInstance } from './componentPublicInstance'
9 13
import { Directive, validateDirectiveName } from './directives'
10 14
import { RootRenderFunction } from './renderer'
@@ -98,7 +102,7 @@ export interface AppContext {
98 102
* Each app instance has its own cache because app-level global mixins and
99 103
* optionMergeStrategies can affect merge behavior.
100 104
*/
101 -
cache: WeakMap<ComponentOptions, ComponentOptions>
105 +
cache: WeakMap<ComponentOptions, MergedComponentOptions>
102 106
/**
103 107
* Flag for de-optimizing props normalization
104 108
* @internal
@@ -531,7 +531,10 @@ const seenConfigObjects = /*#__PURE__*/ new WeakSet<CompatConfig>()
531 531
const warnedInvalidKeys: Record<string, boolean> = {}
532 532 533 533
// dev only
534 -
export function validateCompatConfig(config: CompatConfig) {
534 +
export function validateCompatConfig(
535 +
config: CompatConfig,
536 +
instance?: ComponentInternalInstance
537 +
) {
535 538
if (seenConfigObjects.has(config)) {
536 539
return
537 540
}
@@ -558,6 +561,14 @@ export function validateCompatConfig(config: CompatConfig) {
558 561
warnedInvalidKeys[key] = true
559 562
}
560 563
}
564 + 565 +
if (instance && config[DeprecationTypes.OPTIONS_DATA_MERGE] != null) {
566 +
warn(
567 +
`Deprecation config "${
568 +
DeprecationTypes.OPTIONS_DATA_MERGE
569 +
}" can only be configured globally.`
570 +
)
571 +
}
561 572
}
562 573 563 574
export function getCompatConfigForKey(
@@ -1,39 +1,16 @@
1 -
import { isFunction, isPlainObject } from '@vue/shared'
2 -
import { ComponentInternalInstance } from '../component'
3 -
import { ComponentPublicInstance } from '../componentPublicInstance'
1 +
import { isPlainObject } from '@vue/shared'
4 2
import { DeprecationTypes, warnDeprecation } from './compatConfig'
5 3 6 -
export function deepMergeData(
7 -
to: any,
8 -
from: any,
9 -
instance: ComponentInternalInstance
10 -
) {
4 +
export function deepMergeData(to: any, from: any) {
11 5
for (const key in from) {
12 6
const toVal = to[key]
13 7
const fromVal = from[key]
14 8
if (key in to && isPlainObject(toVal) && isPlainObject(fromVal)) {
15 -
__DEV__ &&
16 -
warnDeprecation(DeprecationTypes.OPTIONS_DATA_MERGE, instance, key)
17 -
deepMergeData(toVal, fromVal, instance)
9 +
__DEV__ && warnDeprecation(DeprecationTypes.OPTIONS_DATA_MERGE, null, key)
10 +
deepMergeData(toVal, fromVal)
18 11
} else {
19 12
to[key] = fromVal
20 13
}
21 14
}
22 15
return to
23 16
}
24 - 25 -
export function mergeDataOption(to: any, from: any) {
26 -
if (!from) {
27 -
return to
28 -
}
29 -
if (!to) {
30 -
return from
31 -
}
32 -
return function mergedDataFn(this: ComponentPublicInstance) {
33 -
return deepMergeData(
34 -
isFunction(to) ? to.call(this, this) : to,
35 -
isFunction(from) ? from.call(this, this) : from,
36 -
this.$
37 -
)
38 -
}
39 -
}
Original file line number Diff line number Diff line change
@@ -34,7 +34,11 @@ import {
34 34
isRuntimeOnly,
35 35
setupComponent
36 36
} from '../component'
37 -
import { RenderFunction, mergeOptions } from '../componentOptions'
37 +
import {
38 +
RenderFunction,
39 +
mergeOptions,
40 +
internalOptionMergeStrats
41 +
} from '../componentOptions'
38 42
import { ComponentPublicInstance } from '../componentPublicInstance'
39 43
import { devtoolsInitApp, devtoolsUnmountApp } from '../devtools'
40 44
import { Directive } from '../directives'
@@ -43,8 +47,7 @@ import { version } from '..'
43 47
import {
44 48
installLegacyConfigWarnings,
45 49
installLegacyOptionMergeStrats,
46 -
LegacyConfig,
47 -
legacyOptionMergeStrats
50 +
LegacyConfig
48 51
} from './globalConfig'
49 52
import { LegacyDirective } from './customDirective'
50 53
import {
@@ -231,8 +234,7 @@ export function createCompatVue(
231 234
mergeOptions(
232 235
extend({}, SubVue.options),
233 236
inlineOptions,
234 -
null,
235 -
legacyOptionMergeStrats as any
237 +
internalOptionMergeStrats as any
236 238
),
237 239
SubVue
238 240
)
@@ -257,8 +259,7 @@ export function createCompatVue(
257 259
SubVue.options = mergeOptions(
258 260
mergeBase,
259 261
extendOptions,
260 -
null,
261 -
legacyOptionMergeStrats as any
262 +
internalOptionMergeStrats as any
262 263
)
263 264 264 265
SubVue.options._base = SubVue
@@ -305,8 +306,7 @@ export function createCompatVue(
305 306
mergeOptions(
306 307
parent,
307 308
child,
308 -
vm && vm.$,
309 -
vm ? undefined : (legacyOptionMergeStrats as any)
309 +
vm ? undefined : (internalOptionMergeStrats as any)
310 310
),
311 311
defineReactive
312 312
}
You can’t perform that action at this time.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4