Dayne Mentier mainfraame

mainfraame / example.feature

Created November 2, 2020 18:13

	Feature: Button

	Given I go to home
	When I click the login button
	Then the login button is not visible

mainfraame / steps.ts

Created November 2, 2020 18:11

	import { Given, When, Then } from 'cucumber';
	import { act } from 'react-dom/test-utils';

	import Element from './path/to/Element';

	Given(/I go to (.*)$/, function(link) {
	window.location.hash = `#/${link}`;
	});

	When(/I click the (\S+) button$/, function(id) {

mainfraame / world.ts

Created November 2, 2020 18:04

	import { setWorldConstructor } from 'cucumber';

	setWorldConstructor(
	class World {
	// this class gets instantiated before the tests start and
	// the value created from that instatiation is what is available in hooks and steps as "this"
	}
	);

mainfraame / hooks.ts

Last active November 2, 2020 18:01

	import React from 'react';
	import ReactDOM from 'react-dom';
	import { act } from 'react-dom/test-utils'
	import { AfterAll, BeforeAll } from 'cucumber';

	import App from './path/to/your/app';

	const $root = document.createElement('div');

	document.body.appendChild($root);

mainfraame / jestConfig.json

Last active November 2, 2020 17:55

	{
	"moduleFileExtensions": [
	"feature", // <--- *1
	],
	"setupFilesAfterEnv": [
	"<rootDir>/node_modules/cucumber-jest/dist/init.js", // <--- *2
	"<rootDir>/test/world.ts",
	"<rootDir>/test/hooks.tsx",
	"<rootDir>/test/steps.ts"
	],

mainfraame / elementUse.ts

Last active November 2, 2020 16:24

	import Element from './path/to/Element'

	// imagine this element <input type="text" data-test-id="foo"/>

	const $element = new Element({
	id: 'foo'
	});


	$element.setValue('bar');

mainfraame / Element.ts

Last active November 2, 2020 16:24

A base class to extend component functionality wrappers with

	import {isEqual} from "lodash";
	import {outdent} from "outdent";
	import {act} from "react-dom/test-utils";
	import {fireEvent} from "@testing-library/react";

	export type ElementProps = {
	id?: string;
	root?: string;
	selector?: string;
	};

mainfraame / AdvancedElement.ts

Last active November 2, 2020 16:13

	import {isEqual} from "lodash";
	import {outdent} from "outdent";
	import {act} from "react-dom/test-utils";
	import {fireEvent} from "@testing-library/react";
	import {dblClick} from "@testing-library/user-event";

	export type JSDOMElementProps = {
	id?: string;
	root?: string;
	selector?: string;