particle-os/debian-image-builder-frontend
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

README: Setup certificate for msw

Browse source 
This adds steps for setting up certificates needed in order to run msw with mocked data.
This commit is contained in:
regexowl 2023-11-21 13:15:24 +01:00 • committed by Klara Simickova
parent 38c97644cb
commit 628bc2808b
1 changed files with 25 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

66
README.md
View file

@ -249,6 +249,42 @@ npm run test
These tests will also be run in our Travis CI when a PR is opened.
### Using MSW data in development
If you want to develop in environment with mocked data, run the command `npm run stage-beta:msw`.
#### Enabling MSW
In a case you're seeing `Error: [MSW] Failed to register the Service Worker` in console, you might also need to configure SSL certification on your computer.
In order to do this install [mkcert](https://github.com/FiloSottile/mkcert)
After the installation, go to the `/node_modules/.cache/webpack-dev-server` folder and run following commands:
1. `mkcert -install`  to create a new certificate authority on your machine
2. `mkcert prod.foo.redhat.com`  to create the actual signed certificate
#### Mac Configuration
Follow these steps to find and paste the certification file into the 'Keychain Access' application:
1. Open the 'Keychain Access' application.
2. Select 'login' on the left side.
3. Navigate to the 'Certificates' tab.
4. Drag the certification file (located at /image-builder-frontend/node_modules/.cache/webpack-dev-server/server.pem) to the certification list.
5. Double-click on the added certificate (localhost certificate) to open the localhost window.
6. Open the 'Trust' dropdown menu.
7. Set all options to 'Always Trust'.
8. Close the localhost screen.
9. Run `npm run stage-beta:msw` and open the Firefox browser to verify that it is working as expected.
## API endpoints
API slice definitions are generated using the [@rtk-query/codegen-openapi](https://redux-toolkit.js.org/rtk-query/usage/code-generation) package.
@ -262,33 +298,3 @@ To generate or update API slice definitions, run:
```bash
npm run api
```
### Using MSW data in development
If you want to develop in environment with mocked data,
run the command `npm run stage-beta:msw`.
To enable msw, you must configure SSL certification on your computer.
## Mac Configurations
Follow these steps to find and paste the certification file into the 'Keychain Access' application:
1. Open the 'Keychain Access' application.
2. Select 'login' on the left side.
3. Navigate to the 'Certificates' tab.
4. Drag the certification file (usually located at /image-builder-frontend/node_modules/.cache/webpack-dev-server/server.pem) to the certification list.
5. Double-click on the added certificate (localhost certificate) to open the localhost window.
6. Open the 'Trust' dropdown menu.
7. Set all options to 'Always Trust'.
8. Close the localhost screen.
9. Run `npm run stage-beta:msw` and open the Firefox browser to verify that it is working as expected.