		import { html, renderer } from '@ficusjs/renderers/htm-preact'
		import { createCustomElement } from '@ficusjs/core/custom-element'

		createCustomElement('required-props', {
		renderer,
		props: {
		name: {
		type: String,
		required: true
		}
		},
		render () {
		return html`<p>Required props: name = ${this.props.name}</p>`
		}
		})

+5

-0

CHANGELOG.md

		@@ -7,2 +7,7 @@ # Changelog

		## [2.2.0] - 2023-07-17

		### Updates
		- Add `attrs` argument to `render` function

		## [2.1.2] - 2022-11-29
		@@ -9,0 +14,0 @@

+5

-5

package.json

		{
		"name": "@ficusjs/testing",
		"version": "2.1.2",
		"version": "2.2.0",
		"description": "Helper functions for component testing",
		@@ -31,8 +31,8 @@ "type": "module",
		"dependencies": {
		"jsdom": "20.0.3"
		"jsdom": "22.1.0"
		},
		"devDependencies": {
		"@ficusjs/core": "3.1.1",
		"@ficusjs/renderers": "5.4.1",
		"ava": "5.1.0",
		"@ficusjs/core": "3.1.2",
		"@ficusjs/renderers": "5.8.0",
		"ava": "5.3.1",
		"standard": "16.0.4"
		@@ -39,0 +39,0 @@ },

+3

-2

README.md

		@@ -57,4 +57,4 @@ # FicusJS testing
		test('render basic component', async t => {
		const comp = await render('basic-comp', () => import('../src/component.mjs'))
		t.is(comp.querySelector('p').textContent, 'Basic component')
		const comp = await render('basic-comp', () => import('../src/component.mjs'), { foo: 'bar' })
		t.is(comp.querySelector('p').textContent, 'Basic component with bar')
		})
		@@ -69,2 +69,3 @@ ```
		\| `importer` \| `function` \| A function that registers a web component. This can return a `Promise` \|
		\| `attrs` \| `object` \| An optional object of attributes to set on the component instance \|

		@@ -71,0 +72,0 @@ ## Testing components

+4

-1

src/index.mjs

		@@ -13,8 +13,11 @@ import { JSDOM } from 'jsdom'

		export async function render (tagName, importer) {
		export async function render (tagName, importer, attrs = {}) {
		await importer()
		const document = globalThis.document
		const basicComp = document.createElement(tagName)
		Object.entries(attrs).forEach(([key, value]) => {
		basicComp.setAttribute(key, value)
		})
		document.body.appendChild(basicComp)
		return basicComp
		}

+5

-0

test/component.spec.mjs

		@@ -10,1 +10,6 @@ import test from 'ava'
		})

		test('render component with required props', async t => {
		const comp = await render('required-props', () => import('./required-props.mjs'), { name: 'test' })
		t.is(comp.querySelector('p').textContent, 'Required props: name = test')
		})

@ficusjs/testing - npm Package Compare versions

Improved metrics