Using Cypress + Vue 3 with a custom template inside the mount function

[TotomInc]

Anyone have tried to mount a custom Vue template within a Cypress mount function?

I've got the following error: Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.js".

Here's the code I tried:

// MyComponent.cy.ts
import { mount } from "cypress/vue";

describe("MyComponent tests", () => {
  it("should display an error message if the field is required", () => {
    mount({
      // Using a custom template here will the warning mentioned above.
      // It will result in a blank testing page, no output.
      template: `<p>test</p>`,
    });
  });
});

[Ferdidurke]

i use vue render function instead template, like this:

const HeaderLayoutWrapper = defineComponent({
	components: {
		Layout,
		Header,
	},
	setup() {
		return () =>
			h(Layout, [
				h(Header, { prop1: true, prop2: false }),
			]);
	},
});

describe('Test Header component', () => {
	it('your test description', () => {
		cy.mount(HeaderLayoutWrapper);
		// any code
	});
});

you can rewrite it for your task