@luigi-project/testing-utilities 2.13.1-dev.202406110716 → 2.13.1-dev.202406120027
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +14 -63
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,21 +1,19 @@
|
|
|
1
1
|
# Luigi Testing Utilities
|
|
2
2
|
|
|
3
|
-
The
|
|
3
|
+
The Luigi Testing Utilities are a set of auxiliary functions used to enhance the user experience while testing Luigi-based micro frontends. The functions abstract away Luigi-specific logic from the tester so that it is easier for them to mock and assert Luigi functionality.
|
|
4
4
|
|
|
5
|
-
## LuigiMockUtil
|
|
6
|
-
|
|
7
|
-
Before version 2.9.0 this class could only be used for [protractor-based](https://www.npmjs.com/package/protractor) e2e tests.
|
|
5
|
+
## LuigiMockUtil
|
|
6
|
+
This class contains certain utility helper functions needed when writing [protractor-based](https://www.npmjs.com/package/protractor) e2e tests. You can simply import this module into you project and then use an instance of it to test micro frontend functionality.
|
|
8
7
|
|
|
9
|
-
|
|
8
|
+
### How to use the library
|
|
10
9
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
_In order to use this utility library, you need to import LuigiMockModule into your Angular application's entry point. See more [here](https://docs.luigi-project.io/docs/framework-support-libraries/?section=luigicontextservice). You also have to install [Cypress](https://www.npmjs.com/package/cypress) or [Protractor](https://www.npmjs.com/package/protractor) locally as a dev dependency for your project. Bear in mind Protractor is deprecated in Angular since version 15._
|
|
10
|
+
### Prerequisites
|
|
11
|
+
_In order to use this utility library, you need to import LuigiMockModule into your Angular application's entry point. See more [here](https://docs.luigi-project.io/docs/framework-support-libraries/?section=luigicontextservice)._
|
|
14
12
|
|
|
15
13
|
|
|
16
14
|
1. Import the library in the `package.json`:
|
|
17
15
|
```javascript
|
|
18
|
-
npm install @luigi-project/testing-utilities
|
|
16
|
+
npm install @luigi-project/testing-utilities -s
|
|
19
17
|
```
|
|
20
18
|
|
|
21
19
|
2. Once the library is imported and saved in your Angular project, you can now import the module `LuigiMockUtil` into your test:
|
|
@@ -23,13 +21,13 @@ npm install @luigi-project/testing-utilities --save-dev
|
|
|
23
21
|
import { LuigiMockUtil } from "@luigi-project/testing-utilities";
|
|
24
22
|
```
|
|
25
23
|
|
|
26
|
-
|
|
24
|
+
#### Example
|
|
27
25
|
|
|
28
26
|
```javascript
|
|
29
27
|
import { browser } from 'protractor'; // <-- target e2e testing library
|
|
30
28
|
import { LuigiMockUtil } from "@luigi-project/testing-utilities";
|
|
31
29
|
|
|
32
|
-
describe('Another test
|
|
30
|
+
describe('Another test', () => {
|
|
33
31
|
let luigiMockUtil: LuigiMockUtil;
|
|
34
32
|
|
|
35
33
|
beforeAll(async () => {
|
|
@@ -41,60 +39,13 @@ describe('Another test using protractor', () => {
|
|
|
41
39
|
someData: '1',
|
|
42
40
|
someOtherData: 'randomInfo',
|
|
43
41
|
});
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
```
|
|
47
|
-
|
|
48
|
-
### Example how to use the library with Cypress
|
|
49
|
-
|
|
50
|
-
```javascript
|
|
51
|
-
describe('Another test using cypress', () => {
|
|
52
|
-
let luigiMockUtil: LuigiMockUtil;
|
|
53
|
-
|
|
54
|
-
beforeAll(async () => {
|
|
55
|
-
// Necessary to execute the functions from LuigiMockUtil in cypress context and get the
|
|
56
|
-
// the window object of the page that is currently active
|
|
57
|
-
cy.window().then((win: any) => {
|
|
58
|
-
luigiMockUtil = new LuigiMockUtil((fn: any) => {
|
|
59
|
-
return new Promise((resolve, reject) => {
|
|
60
|
-
resolve(fn());
|
|
61
|
-
})
|
|
62
|
-
}, win);
|
|
63
|
-
});
|
|
64
|
-
//Necessary that luigi-client sends postmessages to the same window and not to parent (which is cypress engine)
|
|
65
|
-
cy.visit('http://localhost:4200', {
|
|
66
|
-
onBeforeLoad: (win) => {
|
|
67
|
-
win["parent"] = win;
|
|
68
|
-
}
|
|
69
|
-
});
|
|
70
|
-
});
|
|
71
|
-
|
|
72
|
-
it('Mock path exists', () => {
|
|
73
|
-
cy.get('.pathExists').click().then(() => {
|
|
74
|
-
luigiMockUtil.mockPathExists('/test', false);
|
|
75
|
-
});
|
|
76
|
-
cy.getAllSessionStorage().then((result: any) => {
|
|
77
|
-
expect(result).to.deep.equal({
|
|
78
|
-
"http://localhost:4200": {
|
|
79
|
-
luigiMockData: '{"pathExists":{"/test":false}}'
|
|
80
|
-
},
|
|
81
|
-
});
|
|
82
|
-
})
|
|
83
|
-
});
|
|
84
|
-
|
|
85
|
-
it('mock context update', () => {
|
|
86
|
-
let context = {
|
|
87
|
-
ctxKey: 'ctxValue'
|
|
88
|
-
}
|
|
89
|
-
luigiMockUtil.mockContext(context);
|
|
90
|
-
cy.get('#luigi-debug-vis-cnt').contains('{"msg":"luigi.get-context","context":{"ctxKey":"ctxValue"}}');
|
|
91
|
-
});
|
|
92
|
-
});
|
|
42
|
+
}
|
|
43
|
+
}
|
|
93
44
|
```
|
|
94
45
|
|
|
95
46
|
#### Functions provided
|
|
96
|
-
- **mockContext**: Mocks the context by sending Luigi context messages with the desired mocked context as parameter.
|
|
47
|
+
- **mockContext**: Mocks the context by sending Luigi context messages with the desired mocked context as parameter.
|
|
97
48
|
- **mockPathExists**: This method serves as a mock for the Luigi Client `pathExists()` function. It is used in e2e tests when component being tested utilizes a call to `LuigiClient.linkManager().pathExists()`
|
|
98
49
|
- **modalOpenedWithTitle**: Checks on the printed DOM Luigi message responses for a modal with given title being opened. In such a case, a message would be printed containing a `modal.title`. Returns `false` if such element was not found.
|
|
99
|
-
- **getMSG**: Return list of messages, representing message elements added in the DOM for testing.
|
|
100
|
-
- **parseLuigiMockedMessages**: Parses the elements added by LuigiMockModule into the DOM and assigns them to the local messages variable
|
|
50
|
+
- **getMSG**: Return list of messages, representing message elements added in the DOM for testing.
|
|
51
|
+
- **parseLuigiMockedMessages**: Parses the elements added by LuigiMockModule into the DOM and assigns them to the local messages variable
|