Skip to content

Commit 8956c9b

Browse files
MrCullMrCull
authored
Cypess tests
* adding cypress tests * adding more cypress tests sql * adding most cypress tests first draft * adding most cypress tests * renamed cy trst numbering * fixed todo test * fixed timezone * fixed password test * fixed container test * fixed branch tests * working cypress tests * cypress tests on package.json * cypress tests config for ci
1 parent 0f1496e commit 8956c9b

36 files changed

+3008
-91
lines changed

‎cypress.config.cjs‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
const { defineConfig } = require('cypress');
2+
3+
module.exports = defineConfig({
4+
e2e: {
5+
baseUrl: 'http://localhost:4173',
6+
supportFile: false,
7+
specPattern: 'cypress/e2e/**/*.cy.{js,ts}',
8+
experimentalRunAllSpecs: true,
9+
},
10+
});
11+

‎cypress/e2e/components/00-home.cy.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
/// <reference types="cypress" />
2+
3+
// Should test that the home page redirects to the json formatter page
4+
5+
describe('Home Page Redirect', () => {
6+
it('redirects to the JSON Formatter page', () => {
7+
cy.visit('/');
8+
cy.url().should('include', '/json');
9+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
10+
});
11+
});
12+

‎cypress/e2e/components/01-jsonFormatter.cy.js‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
// Cypress E2E test for JsonFormatter.vue
2+
// Covers: valid/invalid JSON, format, clear, copy, error, placeholder
3+
4+
describe('JsonFormatter Component', () => {
5+
const validJson = '{"foo": "bar", "num": 42, "bool": true}';
6+
const formattedJson = `{
7+
"foo": "bar",
8+
"num": 42,
9+
"bool": true
10+
}`;
11+
const invalidJson = '{foo: bar}';
12+
13+
beforeEach(() => {
14+
cy.visit('/json');
15+
});
16+
17+
it('shows placeholder initially', () => {
18+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
19+
cy.get('[data-test-id=json-output]').should('not.exist');
20+
cy.get('[data-test-id=error-message]').should('not.exist');
21+
});
22+
23+
it('formats valid JSON', () => {
24+
cy.get('[data-test-id=json-input]').type(validJson, { delay: 0, parseSpecialCharSequences: false });
25+
cy.get('[data-test-id=format-btn]').click();
26+
cy.get('[data-test-id=json-output]').should('contain.text', '"foo"');
27+
cy.get('[data-test-id=json-output]').should('contain.text', '"bar"');
28+
cy.get('[data-test-id=json-output]').should('contain.text', '"num"');
29+
cy.get('[data-test-id=json-output]').should('contain.text', '42');
30+
cy.get('[data-test-id=error-message]').should('not.exist');
31+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
32+
});
33+
34+
it('clears input and output', () => {
35+
cy.get('[data-test-id=json-input]').type(validJson, { delay: 0, parseSpecialCharSequences: false });
36+
cy.get('[data-test-id=format-btn]').click();
37+
cy.get('[data-test-id=clear-btn]').click();
38+
cy.get('[data-test-id=json-input]').should('have.value', '');
39+
cy.get('[data-test-id=json-output]').should('not.exist');
40+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
41+
});
42+
43+
it('shows error for invalid JSON', () => {
44+
cy.get('[data-test-id=json-input]').type(invalidJson, { delay: 0, parseSpecialCharSequences: false });
45+
cy.get('[data-test-id=format-btn]').click();
46+
cy.get('[data-test-id=error-message]').should('be.visible').and('contain.text', 'Invalid JSON');
47+
cy.get('[data-test-id=json-output]').should('not.exist');
48+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
49+
});
50+
51+
it('copies formatted JSON to clipboard', () => {
52+
cy.window().then(win => {
53+
cy.stub(win.navigator.clipboard, 'writeText').as('writeText');
54+
});
55+
cy.get('[data-test-id=json-input]').type(validJson, { delay: 0, parseSpecialCharSequences: false });
56+
cy.get('[data-test-id=format-btn]').click();
57+
cy.get('[data-test-id=copy-btn]').click();
58+
cy.get('@writeText').should('have.been.calledWith', formattedJson);
59+
});
60+
61+
it('disables buttons appropriately', () => {
62+
cy.get('[data-test-id=format-btn]').should('be.disabled');
63+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
64+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
65+
cy.get('[data-test-id=json-input]').type(validJson, { delay: 0, parseSpecialCharSequences: false });
66+
cy.get('[data-test-id=format-btn]').should('not.be.disabled');
67+
cy.get('[data-test-id=clear-btn]').should('not.be.disabled');
68+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
69+
cy.get('[data-test-id=format-btn]').click();
70+
cy.get('[data-test-id=copy-btn]').should('not.be.disabled');
71+
});
72+
});

‎cypress/e2e/components/02-sql.cy.js‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
// Cypress E2E test for SqlFormatter.vue
2+
// Covers: valid/invalid SQL, format, clear, copy, error, placeholder
3+
4+
describe('SQL Formatter Component', () => {
5+
const validSql = 'select * from users where id = 1;';
6+
7+
beforeEach(() => {
8+
cy.visit('/sql');
9+
});
10+
11+
it('shows placeholder initially', () => {
12+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
13+
cy.get('[data-test-id=sql-output]').should('not.exist');
14+
cy.get('[data-test-id=error-message]').should('not.exist');
15+
});
16+
17+
it('formats valid SQL', () => {
18+
cy.get('[data-test-id=sql-input]').type(validSql, { delay: 0, parseSpecialCharSequences: false });
19+
cy.get('[data-test-id=format-btn]').click();
20+
cy.get('[data-test-id=sql-output]').should('contain.text', 'SELECT');
21+
cy.get('[data-test-id=sql-output]').should('contain.text', 'FROM');
22+
cy.get('[data-test-id=sql-output]').should('contain.text', 'users');
23+
cy.get('[data-test-id=sql-output]').should('contain.text', 'WHERE');
24+
cy.get('[data-test-id=sql-output]').should('contain.text', 'id = 1');
25+
cy.get('[data-test-id=error-message]').should('not.exist');
26+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
27+
});
28+
29+
it('clears input and output', () => {
30+
cy.get('[data-test-id=sql-input]').type(validSql, { delay: 0, parseSpecialCharSequences: false });
31+
cy.get('[data-test-id=format-btn]').click();
32+
cy.get('[data-test-id=clear-btn]').click();
33+
cy.get('[data-test-id=sql-input]').should('have.value', '');
34+
cy.get('[data-test-id=sql-output]').should('not.exist');
35+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
36+
});
37+
38+
it('copies formatted SQL to clipboard', () => {
39+
cy.window().then(win => {
40+
cy.stub(win.navigator.clipboard, 'writeText').as('writeText');
41+
});
42+
cy.get('[data-test-id=sql-input]').type(validSql, { delay: 0, parseSpecialCharSequences: false });
43+
cy.get('[data-test-id=format-btn]').click();
44+
cy.get('[data-test-id=copy-btn]').click();
45+
cy.get('@writeText').should('have.been.called');
46+
});
47+
48+
it('disables buttons appropriately', () => {
49+
cy.get('[data-test-id=format-btn]').should('be.disabled');
50+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
51+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
52+
cy.get('[data-test-id=sql-input]').type(validSql, { delay: 0, parseSpecialCharSequences: false });
53+
cy.get('[data-test-id=format-btn]').should('not.be.disabled');
54+
cy.get('[data-test-id=clear-btn]').should('not.be.disabled');
55+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
56+
cy.get('[data-test-id=format-btn]').click();
57+
cy.get('[data-test-id=copy-btn]').should('not.be.disabled');
58+
});
59+
});

‎cypress/e2e/components/03-csharp.cy.js‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
// Cypress E2E test for CSharpFormatter.vue
2+
// Covers: valid/invalid C# code, format, clear, copy, error, placeholder
3+
4+
describe('C# Formatter Component', () => {
5+
const validCode = 'public class Foo {\npublic int Bar { get; set; }\n}';
6+
const invalidCode = 'public class Foo {'; // Unclosed block
7+
8+
beforeEach(() => {
9+
cy.visit('/csharp');
10+
});
11+
12+
it('shows placeholder initially', () => {
13+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
14+
cy.get('[data-test-id=csharp-output]').should('not.exist');
15+
cy.get('[data-test-id=error-message]').should('not.exist');
16+
});
17+
18+
it('formats valid C# code', () => {
19+
cy.get('[data-test-id=csharp-input]').type(validCode, { delay: 0, parseSpecialCharSequences: false });
20+
cy.get('[data-test-id=format-btn]').click();
21+
cy.get('[data-test-id=csharp-output]').should('contain.text', 'public class Foo');
22+
cy.get('[data-test-id=csharp-output]').should('contain.text', 'public int Bar');
23+
cy.get('[data-test-id=error-message]').should('not.exist');
24+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
25+
});
26+
27+
it('clears input and output', () => {
28+
cy.get('[data-test-id=csharp-input]').type(validCode, { delay: 0, parseSpecialCharSequences: false });
29+
cy.get('[data-test-id=format-btn]').click();
30+
cy.get('[data-test-id=clear-btn]').click();
31+
cy.get('[data-test-id=csharp-input]').should('have.value', '');
32+
cy.get('[data-test-id=csharp-output]').should('not.exist');
33+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
34+
});
35+
36+
it('shows error for invalid C# code', () => {
37+
cy.get('[data-test-id=csharp-input]').type(invalidCode, { delay: 0, parseSpecialCharSequences: false });
38+
cy.get('[data-test-id=format-btn]').click();
39+
// The formatter may not throw error, so just check output or error
40+
cy.get('[data-test-id=error-message], [data-test-id=csharp-output]').should('exist');
41+
});
42+
43+
it('copies formatted C# code to clipboard', () => {
44+
cy.window().then(win => {
45+
cy.stub(win.navigator.clipboard, 'writeText').as('writeText');
46+
});
47+
cy.get('[data-test-id=csharp-input]').type(validCode, { delay: 0, parseSpecialCharSequences: false });
48+
cy.get('[data-test-id=format-btn]').click();
49+
cy.get('[data-test-id=copy-btn]').click();
50+
cy.get('@writeText').should('have.been.called');
51+
});
52+
53+
it('disables buttons appropriately', () => {
54+
cy.get('[data-test-id=format-btn]').should('be.disabled');
55+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
56+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
57+
cy.get('[data-test-id=csharp-input]').type(validCode, { delay: 0, parseSpecialCharSequences: false });
58+
cy.get('[data-test-id=format-btn]').should('not.be.disabled');
59+
cy.get('[data-test-id=clear-btn]').should('not.be.disabled');
60+
cy.get('[data-test-id=copy-btn]').should('be.disabled');
61+
cy.get('[data-test-id=format-btn]').click();
62+
cy.get('[data-test-id=copy-btn]').should('not.be.disabled');
63+
});
64+
});

‎cypress/e2e/components/04-diff.cy.js‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
// Cypress E2E test for DiffTool.vue
2+
// Covers: diffing, clearing, and UI state
3+
4+
describe('Diff Tool Component', () => {
5+
const originalText = 'Hello\nWorld';
6+
const modifiedText = 'Hello\nThere';
7+
8+
beforeEach(() => {
9+
cy.visit('/diff');
10+
});
11+
12+
it('shows empty state initially', () => {
13+
cy.get('[data-test-id=original-input]').should('have.value', '');
14+
cy.get('[data-test-id=modified-input]').should('have.value', '');
15+
cy.get('[data-test-id=diff-result]').should('not.exist');
16+
});
17+
18+
it('compares and shows diff result', () => {
19+
cy.get('[data-test-id=original-input]').type(originalText, { delay: 0, parseSpecialCharSequences: false });
20+
cy.get('[data-test-id=modified-input]').type(modifiedText, { delay: 0, parseSpecialCharSequences: false });
21+
cy.get('[data-test-id=compare-btn]').click();
22+
cy.get('[data-test-id=diff-result]').should('be.visible');
23+
cy.get('[data-test-id=diff-result]').should('contain.text', 'World');
24+
cy.get('[data-test-id=diff-result]').should('contain.text', 'There');
25+
});
26+
27+
it('clears original input', () => {
28+
cy.get('[data-test-id=original-input]').type(originalText, { delay: 0, parseSpecialCharSequences: false });
29+
cy.get('[data-test-id=clear-original-btn]').click();
30+
cy.get('[data-test-id=original-input]').should('have.value', '');
31+
});
32+
33+
it('clears modified input', () => {
34+
cy.get('[data-test-id=modified-input]').type(modifiedText, { delay: 0, parseSpecialCharSequences: false });
35+
cy.get('[data-test-id=clear-modified-btn]').click();
36+
cy.get('[data-test-id=modified-input]').should('have.value', '');
37+
});
38+
39+
it('clears all', () => {
40+
cy.get('[data-test-id=original-input]').type(originalText, { delay: 0, parseSpecialCharSequences: false });
41+
cy.get('[data-test-id=modified-input]').type(modifiedText, { delay: 0, parseSpecialCharSequences: false });
42+
cy.get('[data-test-id=clear-all-btn]').click();
43+
cy.get('[data-test-id=original-input]').should('have.value', '');
44+
cy.get('[data-test-id=modified-input]').should('have.value', '');
45+
cy.get('[data-test-id=diff-result]').should('not.exist');
46+
});
47+
48+
it('disables buttons appropriately', () => {
49+
cy.get('[data-test-id=compare-btn]').should('be.disabled');
50+
cy.get('[data-test-id=clear-original-btn]').should('be.disabled');
51+
cy.get('[data-test-id=clear-modified-btn]').should('be.disabled');
52+
cy.get('[data-test-id=clear-all-btn]').should('be.disabled');
53+
cy.get('[data-test-id=original-input]').type(originalText, { delay: 0, parseSpecialCharSequences: false });
54+
cy.get('[data-test-id=compare-btn]').should('be.disabled');
55+
cy.get('[data-test-id=clear-original-btn]').should('not.be.disabled');
56+
cy.get('[data-test-id=clear-all-btn]').should('not.be.disabled');
57+
cy.get('[data-test-id=modified-input]').type(modifiedText, { delay: 0, parseSpecialCharSequences: false });
58+
cy.get('[data-test-id=compare-btn]').should('not.be.disabled');
59+
cy.get('[data-test-id=clear-modified-btn]').should('not.be.disabled');
60+
cy.get('[data-test-id=clear-all-btn]').should('not.be.disabled');
61+
});
62+
});

‎cypress/e2e/components/05-branch.cy.js‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
// Cypress E2E test for BranchFormatter.vue
2+
// Covers: formatting, clearing, copying, and UI state
3+
4+
describe('Branch Formatter Component', () => {
5+
const inputText = 'Story 123456: Add new feature!';
6+
const expectedOutput = '123456_Add_new_feature';
7+
8+
beforeEach(() => {
9+
cy.visit('/branch');
10+
cy.get('[data-test-id=clear-btn]').click();
11+
});
12+
13+
it('Shows placeholder initially', () => {
14+
cy.get('[data-test-id=branch-input]').should('exist');
15+
cy.get('[data-test-id=branch-output]').should('not.exist');
16+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
17+
});
18+
19+
it('formats branch name', () => {
20+
cy.get('[data-test-id=branch-input]').clear().type(inputText, { delay: 0, parseSpecialCharSequences: false });
21+
cy.get('[data-test-id=format-btn]').click();
22+
cy.get('[data-test-id=branch-output]').should('contain.text', expectedOutput);
23+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
24+
});
25+
26+
it('clears output', () => {
27+
cy.get('[data-test-id=branch-input]').clear().type(inputText, { delay: 0, parseSpecialCharSequences: false });
28+
cy.get('[data-test-id=format-btn]').click();
29+
cy.get('[data-test-id=clear-btn]').click();
30+
cy.get('[data-test-id=branch-input]').should('have.value', '');
31+
cy.get('[data-test-id=branch-output]').should('not.exist');
32+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
33+
});
34+
35+
it('copies formatted branch name to clipboard', () => {
36+
cy.window().then(win => {
37+
cy.stub(win.navigator.clipboard, 'writeText').as('writeText');
38+
});
39+
cy.get('[data-test-id=branch-input]').clear().type(inputText, { delay: 0, parseSpecialCharSequences: false });
40+
cy.get('[data-test-id=format-btn]').click();
41+
cy.get('[data-test-id=copy-btn]').click();
42+
cy.get('@writeText').should('have.been.calledWith', expectedOutput);
43+
});
44+
45+
it('disables buttons appropriately', () => {
46+
cy.get('[data-test-id=format-btn]').should('be.disabled');
47+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
48+
cy.get('[data-test-id=branch-input]').clear().type(inputText, { delay: 0, parseSpecialCharSequences: false });
49+
cy.get('[data-test-id=format-btn]').should('not.be.disabled');
50+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
51+
cy.get('[data-test-id=format-btn]').click();
52+
cy.get('[data-test-id=clear-btn]').should('not.be.disabled');
53+
});
54+
});

‎cypress/e2e/components/06-container.cy.js‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
// Cypress E2E test for ContainerGenerator.vue
2+
// Covers: generating, clearing, copying, and UI state
3+
4+
describe('Container Generator Component', () => {
5+
beforeEach(() => {
6+
cy.visit('/container');
7+
});
8+
9+
it('shows placeholder initially', () => {
10+
cy.get('[data-test-id=owner-code-input]').should('exist');
11+
cy.get('[data-test-id=container-output]').should('not.exist');
12+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
13+
});
14+
15+
it('generates container numbers', () => {
16+
cy.get('[data-test-id=owner-code-input]').clear().type('MSC', { delay: 0, parseSpecialCharSequences: false });
17+
cy.get('[data-test-id=category-select]').select('U');
18+
cy.get('[data-test-id=quantity-input]').clear().type('3', { delay: 0, parseSpecialCharSequences: false });
19+
cy.get('[data-test-id=generate-btn]').click();
20+
cy.get('[data-test-id=container-output]').should('be.visible');
21+
cy.get('[data-test-id=container-output] .container-item').should('have.length', 3);
22+
cy.get('[data-test-id=placeholder-message]').should('not.exist');
23+
});
24+
25+
it('clears output', () => {
26+
cy.get('[data-test-id=owner-code-input]').clear().type('MSC', { delay: 0, parseSpecialCharSequences: false });
27+
cy.get('[data-test-id=generate-btn]').click();
28+
cy.get('[data-test-id=clear-btn]').click();
29+
cy.get('[data-test-id=container-output]').should('not.exist');
30+
cy.get('[data-test-id=placeholder-message]').should('be.visible');
31+
});
32+
33+
it('copies a container number to clipboard', () => {
34+
cy.window().then(win => {
35+
cy.stub(win.navigator.clipboard, 'writeText').as('writeText');
36+
});
37+
cy.get('[data-test-id=owner-code-input]').clear().type('MSC', { delay: 0, parseSpecialCharSequences: false });
38+
cy.get('[data-test-id=generate-btn]').click();
39+
cy.get('[data-test-id=container-output] .container-item').first().then($item => {
40+
const number = $item.find('.container-number').text();
41+
cy.get(`[data-test-id=copy-btn-${number}]`).click();
42+
cy.get('@writeText').should('have.been.calledWith', number);
43+
});
44+
});
45+
46+
it('disables buttons appropriately', () => {
47+
cy.get('[data-test-id=generate-btn]').should('not.be.disabled');
48+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
49+
cy.get('[data-test-id=owner-code-input]').clear().type('MSC', { delay: 0, parseSpecialCharSequences: false });
50+
cy.get('[data-test-id=generate-btn]').should('not.be.disabled');
51+
cy.get('[data-test-id=clear-btn]').should('be.disabled');
52+
cy.get('[data-test-id=generate-btn]').click();
53+
cy.get('[data-test-id=clear-btn]').should('not.be.disabled');
54+
});
55+
});

0 commit comments

Comments
 (0)