From 2cbde9b8ef2a356613ecda84d95d55fa12eaa4a8 Mon Sep 17 00:00:00 2001
From: Sander <info@mesander.com>
Date: Thu, 2 Mar 2023 22:43:08 +0100
Subject: [PATCH] chore(ct): vue2 import h from vue (#21035)

---
 .../playwright-ct-vue2/registerSource.mjs     | 27 +++++++++----------
 1 file changed, 12 insertions(+), 15 deletions(-)

diff --git a/packages/playwright-ct-vue2/registerSource.mjs b/packages/playwright-ct-vue2/registerSource.mjs
index 64b8ac5042..9477e102f2 100644
--- a/packages/playwright-ct-vue2/registerSource.mjs
+++ b/packages/playwright-ct-vue2/registerSource.mjs
@@ -18,7 +18,7 @@
 
 // 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('vue').Component} FrameworkComponent */
@@ -36,10 +36,9 @@ export function register(components) {
 
 /**
  * @param {Component | string} child
- * @param {import('vue').CreateElement} h
  */
-function createChild(child, h) {
-  return typeof child === 'string' ? child : createWrapper(child, h);
+function createChild(child) {
+  return typeof child === 'string' ? child : createWrapper(child);
 }
 
 /**
@@ -58,9 +57,8 @@ function componentHasKeyInProps(Component, key) {
 
 /**
  * @param {Component} component
- * @param {import('vue').CreateElement} h
  */
-function createComponent(component, h) {
+function createComponent(component) {
   /**
    * @type {import('vue').Component | string | undefined}
    */
@@ -99,9 +97,9 @@ function createComponent(component, h) {
       if (typeof child !== 'string' && child.type === 'template' && child.kind === 'jsx') {
         const slotProperty = Object.keys(child.props).find(k => k.startsWith('v-slot:'));
         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 {
-        children.push(createChild(child, h));
+        children.push(createChild(child));
       }
     }
 
@@ -122,7 +120,7 @@ function createComponent(component, h) {
     // Vue test util syntax.
     const options = component.options || {};
     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')
         children.push(...list);
       else
@@ -147,11 +145,10 @@ function createComponent(component, h) {
 
 /**
  * @param {Component} component
- * @param {import('vue').CreateElement} h
  * @returns {import('vue').VNode}
  */
-function createWrapper(component, h) {
-  const { Component, nodeData, slots } = createComponent(component, h);
+function createWrapper(component) {
+  const { Component, nodeData, slots } = createComponent(component);
   const wrapper = h(Component, nodeData, slots);
   return wrapper;
 }
@@ -166,8 +163,8 @@ window.playwrightMount = async (component, rootElement, hooksConfig) => {
 
   const instance = new Vue({
     ...options,
-    render: h => {
-      const wrapper = createWrapper(component, h);
+    render: () => {
+      const wrapper = createWrapper(component);
       /** @type {any} */ (rootElement)[wrapperKey] = wrapper;
       return wrapper;
     },
@@ -193,7 +190,7 @@ window.playwrightUpdate = async (element, options) => {
     throw new Error('Component was not mounted');
 
   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 || {})) {
     component.$on(name, value);