Getting the button working

examples/element-factory/src/button.test.js

@@ -1,9 +1,26 @@
+import { screen, fireEvent } from '@testing-library/dom';
+import userEvent from '@testing-library/user-event';
 import { createButton } from './button.js';
 
-describe.todo('createButton', () => {
+describe('createButton', () => {
-  it('should create a button element', () => {});
+  beforeEach(() => {
+    document.innerHTML = '';
+  });
 
-  it('should have the text "Click Me"', () => {});
+  it.skip('should create a button element', () => {
+    document.body.appendChild(createButton());
 
-  it('should change the text to "Clicked!" when clicked', async () => {});
+    const button = screen.getByRole('button', { name: 'Click Me' });
+
+    expect(button).toBeInTheDocument();
+  });
+
+  it('should change the text to "Clicked!" when clicked', async () => {
+    document.body.appendChild(createButton());
+    const button = screen.getByRole('button', { name: 'Click Me' });
+
+    await userEvent.click(button);
+
+    expect(button.textContent).toBe('Clicked!');
+  });
 });