Skip to content

Commit 2a7b4fb

Browse files
thiagojacintothiagojacinto
committed
Merge branch 'release/2.0-screenplay' into main
Implemented Screenplay pattern
2 parents 55110f3 + 68abd59 commit 2a7b4fb

36 files changed

+2481
-124
lines changed

‎.eslintrc.init.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true
5+
},
6+
"extends": "eslint:recommended",
7+
"globals": {
8+
"Atomics": "readonly",
9+
"SharedArrayBuffer": "readonly"
10+
},
11+
"parserOptions": {
12+
"ecmaVersion": 2018,
13+
"sourceType": "module"
14+
},
15+
"rules": {
16+
}
17+
}

‎.eslintrc.json

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true
5+
},
6+
"parserOptions": {
7+
"ecmaVersion": 2018,
8+
"sourceType": "module"
9+
},
10+
"extends": "eslint:recommended",
11+
"globals": {
12+
"cy": "readonly",
13+
"Cypress": "readonly"
14+
},
15+
"rules": {
16+
}
17+
}

‎.prettierignore

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
# Extensions
2+
*.html
3+
*.feature
4+
5+
# Node
6+
node_modules
7+
8+
# Report outputs
9+
results
10+
11+
# Cypress example and initial structure
12+
cypress/integration/examples

‎README.md

Lines changed: 80 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,97 @@
11
# Cypress.io with Patterns
22

3-
Using Cypress to handle automation tests implementing Page Objects and Screenplay patterns.
3+
Using Cypress to handle automation tests implementing Page Objects and Screenplay patterns.
44

55
## BDD Features with Gherkin
66

77
The goal was to develop automation tests to the simple list app available at http://repo-listing.web.app
88

99
To achieve that, Gherkin features lead the way of thinking the core features of that system. Given/When/Then strategy was used here:
1010

11-
* [_adicionar.feature_](./features/adicionar.feature)
12-
* [_remover.feature_](./features/remover.feature)
11+
- [_adicionar.feature_](./features/adicionar.feature)
12+
- [_remover.feature_](./features/remover.feature)
1313

1414
## Page objects pattern
1515

1616
Development with this pattern was done under the branch [feature/page-objects](https://github.com/thiagojacinto/cypress-with-patterns/tree/feature/page-objects).
1717

18-
> Objeto _Home_:
18+
> Object _Home_:
19+
20+
- [support/](./cypress/support)
21+
- [pageObjects/](./cypress/support/pageObjects)
22+
- [Home/](./cypress/support/pageObjects/Home)
23+
- [elements.components.js](./cypress/support/pageObjects/Home/elements.components.js)
24+
- [index.js](./cypress/support/pageObjects/Home/index.js)
25+
26+
> Tests:
27+
28+
- [integration/](./cypress/integration)
29+
- [page-objects/](./cypress/integration/page-objects)
30+
- [adicionar.spec.js](./cypress/integration/page-objects/adicionar.spec.js)
31+
- [remover.spec.js](./cypress/integration/page-objects/remover.spec.js)
32+
33+
## Screenplay pattern
34+
35+
Implementation of this pattern was developed after the page object approuch. Another strategy was using fixture to handle import data from external file (ex: json) and randomize inputs.
36+
37+
> Fixture:
38+
39+
* [fixtures/](./cypress/fixtures)
40+
* [repositorios.json](./cypress/fixtures/repositorios.json)
41+
42+
> _Screenplay pattern_ base files:
43+
44+
Five original blocks were simplified to 3: [Actor](./cypress/support/screenplay/agente/Agente.js), [Task](./cypress/support/screenplay/tarefa/Tarefa.js) and [Questions](./cypress/support/screenplay/dado-quando-entao/DadoQuandoEntao.js), here translated to _Agente, Tarefa_ e _DadoQuandoEntao_, respectively.
45+
1946
* [support/](./cypress/support)
20-
* [pageObjects/](./cypress/support/pageObjects)
21-
* [Home/](./cypress/support/pageObjects/Home)
22-
* [elements.components.js](./cypress/support/pageObjects/Home/elements.components.js)
23-
* [index.js](./cypress/support/pageObjects/Home/index.js)
47+
* [screenplay/](./cypress/support/screenplay)
48+
* [agente/](./cypress/support/screenplay/agente)
49+
* [Agente.js](./cypress/support/screenplay/agente/Agente.js)
50+
* [Usuario.js](./cypress/support/screenplay/agente/Usuario.js)
51+
* [index.js](./cypress/support/screenplay/agente/index.js)
52+
* [dado-quando-entao/](./cypress/support/screenplay/dado-quando-entao)
53+
* [DadoQuandoEntao.js](./cypress/support/screenplay/dado-quando-entao/DadoQuandoEntao.js)
54+
* [index.js](./cypress/support/screenplay/dado-quando-entao/index.js)
55+
* [tarefa/](./cypress/support/screenplay/tarefa)
56+
* [Tarefa.js](./cypress/support/screenplay/tarefa/Tarefa.js)
57+
* [index.js](./cypress/support/screenplay/tarefa/index.js)
58+
* [utils/](./cypress/support/screenplay/utils)
59+
* [index.js](./cypress/support/screenplay/utils/index.js)
60+
* [naoImplementado.error.js](./cypress/support/screenplay/utils/naoImplementado.error.js)
61+
* [ScreenplayItem.js](./cypress/support/screenplay/ScreenplayItem.js)
62+
* [index.js](./cypress/support/screenplay/index.js)
63+
64+
> Tests:
2465
25-
> Testes:
2666
* [integration/](./cypress/integration)
27-
* [page-objects/](./cypress/integration/page-objects)
28-
* [adicionar.spec.js](./cypress/integration/page-objects/adicionar.spec.js)
29-
* [remover.spec.js](./cypress/integration/page-objects/remover.spec.js)
67+
* [screenplay/](./cypress/integration/screenplay)
68+
* [Tarefas/](./cypress/integration/screenplay/Tarefas)
69+
* [AcessarHome.tarefa.js](./cypress/integration/screenplay/Tarefas/AcessarHome.tarefa.js)
70+
* [AdicionarValorVazio.tarefa.js](./cypress/integration/screenplay/Tarefas/AdicionarValorVazio.tarefa.js)
71+
* [EsperarListaContendoDoisItens.tarefa.js](./cypress/integration/screenplay/Tarefas/EsperarListaContendoDoisItens.tarefa.js)
72+
* [EsperarListaContendoUmItem.tarefa.js](./cypress/integration/screenplay/Tarefas/EsperarListaContendoUmItem.tarefa.js)
73+
* [ExibirLista.tarefa.js](./cypress/integration/screenplay/Tarefas/ExibirLista.tarefa.js)
74+
* [ExibirListaContendoTres.tarefa.js](./cypress/integration/screenplay/Tarefas/ExibirListaContendoTres.tarefa.js)
75+
* [InserirNovoRepositorio.tarefa.js](./cypress/integration/screenplay/Tarefas/InserirNovoRepositorio.tarefa.js)
76+
* [LimparLista.tarefa.js](./cypress/integration/screenplay/Tarefas/LimparLista.tarefa.js)
77+
* [RemoverItem.tarefa.js](./cypress/integration/screenplay/Tarefas/RemoverItem.tarefa.js)
78+
* [VisualizarListaComItens.tarefa.js](./cypress/integration/screenplay/Tarefas/VisualizarListaComItems.tarefa.js)
79+
* [VisualizarListaVazia.tarefa.js](./cypress/integration/screenplay/Tarefas/VisualizarListaVazia.tarefa.js)
80+
* [index.js](./cypress/integration/screenplay/Tarefas/index.js)
81+
* [adicionar/](./cypress/integration/screenplay/adicionar)
82+
* [adicionar.screenplay.spec.js](./cypress/integration/screenplay/adicionar/adicionar.screenplay.spec.js)
83+
* [componentes/](./cypress/integration/screenplay/componentes)
84+
* [home.componentes.js](./cypress/integration/screenplay/componentes/home.componentes.js)
85+
* [remover/](./cypress/integration/screenplay/remover)
86+
* [remover.screenplay.spec.js](./cypress/integration/screenplay/remover/remover.screenplay.spec.js)
87+
88+
## Lint and precommit hook
89+
90+
This project uses ESLint, Prettier and lint-staged to handle linting operations and precommit hook.
91+
92+
Before hands-on, do not forget to run:
93+
94+
```
95+
npm install
96+
npx mrm lint-staged
97+
```

‎cypress.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
"video": false,
33
"nodeVersion": "system",
44
"baseUrl": "https://repo-listing.web.app",
5-
"testFiles": "page-objects/**.spec.js",
5+
"testFiles": ["screenplay/**/**.spec.js", "page-objects/**/**.spec.js"],
66

77
"reporter": "mochawesome",
88
"reporterOptions": {

‎cypress/fixtures/repositorios.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"lista": [
3+
"thiagojacinto/es6-review",
4+
"cypress-io/cypress-example-recipes",
5+
"rust-lang/rust",
6+
"hapijs/hapi",
7+
"cli/cli"
8+
]
9+
}

‎cypress/integration/screenplay/Tarefas/AcessarHome.tarefa.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Tarefa, Agente } from "../../../support/screenplay"; //eslint-disable-line
2+
/**
3+
* @class {Tarefa} que representa navegar para homescreen.
4+
*/
5+
export class AcessarHome extends Tarefa {
6+
/**
7+
* Navega para a homescreen.
8+
* @param {Agente} agente
9+
* @returns {Agente} agente
10+
*/
11+
executaComo(agente) {
12+
cy.visit(""); // cypress.json setting baseUrl
13+
cy.viewport("samsung-note9");
14+
return agente;
15+
}
16+
}

‎cypress/integration/screenplay/Tarefas/AdicionarValorVazio.tarefa.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { Tarefa } from "../../../support/screenplay";
2+
import { ELEMENTS } from "../componentes/home.componentes";
3+
4+
/**
5+
* @class AdicionarValorVazio
6+
* @classdesc {Tarefa} que representa inserir um valor vazio no texto e inserir a lista.
7+
*/
8+
export class AdicionarValorVazio extends Tarefa {
9+
/**
10+
* Sem inserir nenhum valor para o campo de texto, adiciona valor vazio a lista.
11+
* @param {Agente} agente
12+
*/
13+
executaComo(agente) {
14+
cy.get(ELEMENTS.submitButton)
15+
.focus()
16+
.click()
17+
.wait(100);
18+
cy.get(ELEMENTS.unorderedList, { timeout: 3000 });
19+
return agente;
20+
}
21+
}

‎cypress/integration/screenplay/Tarefas/EsperarListaContendoDoisItens.tarefa.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { ExibirLista } from "./ExibirLista.tarefa";
2+
/**
3+
* @class ExibirListaContendoTresItems
4+
* @classdesc extende o comportamento da class ExibirLista e verifica se a lista apresenta 2 items.
5+
*/
6+
export class EsperarListaContendoDoisItens extends ExibirLista {
7+
constructor() {
8+
super();
9+
this.contendo(2);
10+
}
11+
}

‎cypress/integration/screenplay/Tarefas/EsperarListaContendoUmItem.tarefa.js

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import { ExibirLista } from "./ExibirLista.tarefa";
2+
/**
3+
* @class ExibirListaContendoTresItems
4+
* @classdesc extende o comportamento da class ExibirLista e verifica se a lista apresenta 1 item.
5+
*/
6+
export class EsperarListaContendoUmItem extends ExibirLista {
7+
constructor() {
8+
super();
9+
this.contendo(1);
10+
}
11+
}

0 commit comments

Comments
 (0)