Setting up test suite and adding an example test

themes/10up-theme/.eslintrc

@@ -1,3 +1,9 @@
 {
-    "extends": ["@10up/eslint-config/wordpress"]
+	"settings": {
+		"jest": {
+			"version": 25,
+			"react": 17
+		}
+	},
+    "extends": ["@10up/eslint-config/wordpress", "@10up/eslint-config/jest"]
 }

themes/10up-theme/__mocks__/@wordpress/block-editor.js

@@ -0,0 +1,6 @@
+/* eslint-disable react/prop-types */
+const RichText = ({ onChange }) => <textarea onChange={onChange} />;
+
+module.exports = {
+	RichText,
+};

themes/10up-theme/__mocks__/@wordpress/i18n.js

@@ -0,0 +1,3 @@
+module.exports = {
+	__: jest.fn((text) => text),
+};

themes/10up-theme/babel.config.js

@@ -0,0 +1,3 @@
+module.exports = {
+	presets: [['@10up/babel-preset-default', { wordpress: true }]],
+};

themes/10up-theme/includes/blocks/example-block/__tests__/edit.js

@@ -0,0 +1,23 @@
+import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import Edit from '../edit';
+
+describe('example block', () => {
+	test('edit component works', () => {
+		const setAttributes = jest.fn();
+		const { container } = render(
+			<Edit setAttributes={setAttributes} attributes={{ currentTitle: 'test' }} />,
+		);
+
+		expect(container).toMatchInlineSnapshot(`
+		<div>
+		  <div>
+		    <textarea />
+		  </div>
+		</div>
+		`);
+
+		userEvent.type(screen.getByRole('textbox'), 'my value');
+		expect(setAttributes).toHaveBeenCalled();
+	});
+});

themes/10up-theme/jest-unit.config.js

@@ -0,0 +1,4 @@
+module.exports = {
+	preset: '@wordpress/jest-preset-default',
+	setupFilesAfterEnv: ['./setupTests.js'],
+};

themes/10up-theme/package.json

@@ -8,13 +8,18 @@
     "format-js": "10up-scripts format-js",
     "lint-js": "10up-scripts lint-js",
     "lint-style": "10up-scripts lint-style",
-    "test": "10up-scripts test-unit-jest"
+    "test": "10up-scripts test-unit-jest",
+    "test-watch": "10up-scripts test-unit-jest --watch"
   },
   "engines": {
     "node": ">=12.0.0"
   },
   "devDependencies": {
-    "@10up/scripts": "^1.1.1"
+    "@10up/scripts": "^1.1.3",
+    "@testing-library/dom": "^7.29.6",
+    "@testing-library/jest-dom": "^5.11.9",
+    "@testing-library/react": "^11.2.5",
+    "@testing-library/user-event": "^12.7.3"
   },
   "dependencies": {
     "normalize.css": "^8.0.1",

themes/10up-theme/setupTests.js

@@ -0,0 +1,2 @@
+import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';