microsoft/playwright
1
1
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2024-12-13 17:14:02 +03:00
Code Issues Projects Releases Wiki Activity

chore(ct): vue2 import h from vue (#21035)

Browse Source
This commit is contained in:
Sander 2023-03-02 22:43:08 +01:00 committed by GitHub
parent d58d833daf
commit 2cbde9b8ef
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
packages/playwright-ct-vue2/registerSource.mjs
View File

@ -18,7 +18,7 @@
// This file is injected into the registry as text, no dependencies are allowed. // This file is injected into the registry as text, no dependencies are allowed.
import Vue from 'vue'; import Vue, { h } from 'vue';
/** @typedef {import('../playwright-test/types/component').Component} Component */ /** @typedef {import('../playwright-test/types/component').Component} Component */
/** @typedef {import('vue').Component} FrameworkComponent */ /** @typedef {import('vue').Component} FrameworkComponent */
@ -36,10 +36,9 @@ export function register(components) {
/** /**
* @param {Component | string} child * @param {Component | string} child
* @param {import('vue').CreateElement} h
*/ */
function createChild(child, h) { function createChild(child) {
return typeof child === 'string' ? child : createWrapper(child, h); return typeof child === 'string' ? child : createWrapper(child);
} }
/** /**
@ -58,9 +57,8 @@ function componentHasKeyInProps(Component, key) {
/** /**
* @param {Component} component * @param {Component} component
* @param {import('vue').CreateElement} h
*/ */
function createComponent(component, h) { function createComponent(component) {
/** /**
* @type {import('vue').Component | string | undefined} * @type {import('vue').Component | string | undefined}
*/ */
@ -99,9 +97,9 @@ function createComponent(component, h) {
if (typeof child !== 'string' && child.type === 'template' && child.kind === 'jsx') { if (typeof child !== 'string' && child.type === 'template' && child.kind === 'jsx') {
const slotProperty = Object.keys(child.props).find(k => k.startsWith('v-slot:')); const slotProperty = Object.keys(child.props).find(k => k.startsWith('v-slot:'));
const slot = slotProperty ? slotProperty.substring('v-slot:'.length) : 'default'; const slot = slotProperty ? slotProperty.substring('v-slot:'.length) : 'default';
nodeData.scopedSlots[slot] = () => child.children.map(c => createChild(c, h)); nodeData.scopedSlots[slot] = () => child.children.map(c => createChild(c));
} else { } else {
children.push(createChild(child, h)); children.push(createChild(child));
} }
} }
@ -122,7 +120,7 @@ function createComponent(component, h) {
// Vue test util syntax. // Vue test util syntax.
const options = component.options || {}; const options = component.options || {};
for (const [key, value] of Object.entries(options.slots || {})) { for (const [key, value] of Object.entries(options.slots || {})) {
const list = (Array.isArray(value) ? value : [value]).map(v => createChild(v, h)); const list = (Array.isArray(value) ? value : [value]).map(v => createChild(v));
if (key === 'default') if (key === 'default')
children.push(...list); children.push(...list);
else else
@ -147,11 +145,10 @@ function createComponent(component, h) {
/** /**
* @param {Component} component * @param {Component} component
* @param {import('vue').CreateElement} h
* @returns {import('vue').VNode} * @returns {import('vue').VNode}
*/ */
function createWrapper(component, h) { function createWrapper(component) {
const { Component, nodeData, slots } = createComponent(component, h); const { Component, nodeData, slots } = createComponent(component);
const wrapper = h(Component, nodeData, slots); const wrapper = h(Component, nodeData, slots);
return wrapper; return wrapper;
} }
@ -166,8 +163,8 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => {
const instance = new Vue({ const instance = new Vue({
...options, ...options,
render: h => { render: () => {
const wrapper = createWrapper(component, h); const wrapper = createWrapper(component);
/** @type {any} */ (rootElement)[wrapperKey] = wrapper; /** @type {any} */ (rootElement)[wrapperKey] = wrapper;
return wrapper; return wrapper;
}, },
@ -193,7 +190,7 @@ window.playwrightUpdate = async (element, options) => {
throw new Error('Component was not mounted'); throw new Error('Component was not mounted');
const component = wrapper.componentInstance; const component = wrapper.componentInstance;
const { nodeData, slots } = createComponent(options, component.$createElement); const { nodeData, slots } = createComponent(options);
for (const [name, value] of Object.entries(nodeData.on || {})) { for (const [name, value] of Object.entries(nodeData.on || {})) {
component.$on(name, value); component.$on(name, value);