tests: adds cypress tests for fullstack_demo

[anthonydmays]

• tests: configures e2e
• chore: removes unused types ref

[Copilot]

Pull Request Overview

Adds end-to-end testing support for the fullstack_demo using Cypress and Clerk, and removes an unused types reference.

• Configures Cypress scripts and dependencies in package.json
• Introduces Cypress support files, E2E tests (todo.cy.ts, auth.cy.ts), and updates cypress.config.ts
• Documents testing setup in README.md and updates .gitignore to ignore cypress.env.json

Reviewed Changes

Copilot reviewed 8 out of 9 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
lib/javascript/fullstack_demo/package.json	Added "type": "module", Cypress scripts (cy:open:e2e, cy:run:e2e), and @clerk/testing dev dependency
lib/javascript/fullstack_demo/cypress/support/e2e.ts	Registered Clerk and visual regression commands in support
lib/javascript/fullstack_demo/cypress/support/commands.ts	Registered visual regression command (duplicate with e2e support)
lib/javascript/fullstack_demo/cypress/e2e/todo.cy.ts	New E2E test for adding and completing todos
lib/javascript/fullstack_demo/cypress/e2e/auth.cy.ts	New E2E test for authentication flow
lib/javascript/fullstack_demo/cypress.config.ts	Configured Cypress E2E settings, Clerk plugin, and visual regression
lib/javascript/fullstack_demo/README.md	Added testing instructions for Cypress and Clerk
lib/javascript/fullstack_demo/.gitignore	Ignored cypress.env.json

Files not reviewed (1)

• lib/javascript/fullstack_demo/package-lock.json: Language not supported

Comments suppressed due to low confidence (2)

lib/javascript/fullstack_demo/cypress/support/commands.ts:4

• Duplicate invocation of addCompareSnapshotCommand(). Since this command is also registered in support/e2e.ts, consider consolidating it in one support file to avoid duplication.

addCompareSnapshotCommand();

lib/javascript/fullstack_demo/README.md:60

• The tests still use cy.origin, which contradicts this documentation. Either update the docs to reflect current usage or remove the cy.origin calls in tests.

- This avoids cross-origin issues that would require `cy.origin()`.

[Copilot]

Duplicate invocation of addCompareSnapshotCommand() already provided via commands.ts. Consider removing this line or the one in commands.ts to centralize command registration.

Suggested change

	// Add visual regression testing command
	addCompareSnapshotCommand();
	// Removed duplicate invocation of addCompareSnapshotCommand()

[Copilot]

[nitpick] Wrapping test interactions in cy.origin is unnecessary when using setupClerkTestingToken() and a configured baseUrl. You can simplify tests by removing cy.origin blocks and directly interact with the app.

Suggested change

	cy.origin('http://localhost:3000', () => {
	// Create a unique todo item
	const todoText = `Test Todo ${Date.now()}`;
	// Find the input field and type the text
	cy.get('input[placeholder*="Add"]').type(todoText);
	// Submit the form (either by clicking a button or pressing Enter)
	cy.get('form').submit();
	// Or use this if the form doesn't have a submit button: cy.get('input').type('{enter}');
	// Verify the new todo appeared in the list
	cy.contains(todoText).should('be.visible');
	});
	});
	it('should allow marking a todo item as completed', () => {
	cy.origin('http://localhost:3000', () => {
	// First, ensure there is at least one todo item to mark as completed
	cy.get('.todo').last().as('lastTodo');
	// Click the checkbox or toggle button to mark it as completed
	cy.get('@lastTodo').find('input[type="checkbox"]').check();
	// Verify the todo item is marked as completed (adjust selector as needed)
	cy.get('@lastTodo').find('input[type="checkbox"]').should('be.checked');
	});
	// Create a unique todo item
	const todoText = `Test Todo ${Date.now()}`;
	// Find the input field and type the text
	cy.get('input[placeholder*="Add"]').type(todoText);
	// Submit the form (either by clicking a button or pressing Enter)
	cy.get('form').submit();
	// Or use this if the form doesn't have a submit button: cy.get('input').type('{enter}');
	// Verify the new todo appeared in the list
	cy.contains(todoText).should('be.visible');
	});
	it('should allow marking a todo item as completed', () => {
	// First, ensure there is at least one todo item to mark as completed
	cy.get('.todo').last().as('lastTodo');
	// Click the checkbox or toggle button to mark it as completed
	cy.get('@lastTodo').find('input[type="checkbox"]').check();
	// Verify the todo item is marked as completed (adjust selector as needed)
	cy.get('@lastTodo').find('input[type="checkbox"]').should('be.checked');

[Copilot]

[nitpick] Using cy.origin here may not be needed given the testing token setup and baseUrl. Consider simplifying by removing the cy.origin block for clearer test flow.

Suggested change

	cy.origin('http://localhost:3000', () => {
	cy.contains('Todo App', { timeout: 5000 }).should('be.visible');
	});
	cy.contains('Todo App', { timeout: 5000 }).should('be.visible');