javascript / expert
Snippet
Reaktive Status-Proxy-Abfangung in Unit-Test-Harnesses
Das Testen von zustandsbehafteten reaktiven Strukturen ohne vollständiges Mounten erfordert das Abfangen von Proxy-Operationen. Das Ummanteln eines reaktiven Stores in einen sekundären Proxy ermöglicht die unterbrechungsfreie Aufzeichnung von Statusänderungen während Testauswertungen.
snippet.js
javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
import { reactive, isReactive } from 'vue';export function createMutationTracker(targetState) {const mutations = [];if (!isReactive(targetState)) {throw new TypeError('Target state must be reactive');}const spyProxy = new Proxy(targetState, {set(target, property, value, receiver) {mutations.push({ property, oldValue: target[property], newValue: value });return Reflect.set(target, property, value, receiver);}});return { spyProxy, getMutations: () => [...mutations] };}
vue
Erklärung
1
if (!isReactive(targetState)) {
Stellt sicher, dass die Proxy-Initialisierung nur auf valide reaktive Vue-Objekte angewendet wird.
2
const spyProxy = new Proxy(targetState, {
Ummantelt den reaktiven Status mit einem Proxy, um Eigenschaftszuweisungen aufzuzeichnen.
3
mutations.push({ property, oldValue: target[property], newValue: value });
Protokolliert Statusänderungen für Zusicherungen in automatisierten Test-Suites.
4
return Reflect.set(target, property, value, receiver);
Leitet die Eigenschaftsänderung nahtlos an reaktive Vue-Trap-Handler weiter.