gateway-edit
![CI Status](https://github.com/unfoldingWord/gateway-edit/workflows/Run%20Cypress%20and%20Jest%20Tests/badge.svg)
Main:
Develop:
![codecov](https://codecov.io/gh/unfoldingWord/gateway-edit/branch/develop/graph/badge.svg?token=0HTP1JR1UL)
Book Package harmonized view.
Staging Environment URLs
Scripts
- "report:combined": combines Cypress & Jest test coverage reports into one coverage report.
Running tests
- Before running any tests, make sure initialized by doing:
yarn
- also before running cypress tests, you must create a file
cypress.env.json
with contents such as (of course replace text in << >>
with you user login credentials):
{
"TEST_USERNAME": <<my user name>>,
"TEST_PASSWORD": <<my user password>>
}
Running Jest Unit Tests
yarn run test:unit
Running Cypress tests Interactively
- in first terminal, start the app by (in Windows, run this in
git Bash
as it needs bash):
yarn dev
- then in second terminal, to run cypress interactively do:
yarn run cypress
Running Cypress tests headless
- in terminal, start the app by (in Windows, run this in
git Bash
as it needs bash):
yarn test:headless
UI Design
- Structure of the React components in this app
Application (in pages/_app.js) contains:
- AuthContext context
- StoreContext context:
Home (in pages/index.js) contains:
WorkspaceContainer component manages the Resource workspace
- Contains Workspace component (resource workspace rcl) that contains several:
- ScriptureCard components
- ResourceCard components
Layout component:
- accesses authentication context and store context
- Manages server selection through url variables
- Displays Onboarding component if login is required
- Contains the header and footer
BibleReference component:
- Uses bible Reference RCL
- Updates reference store context
Onboarding component
- Displays the AccountSetup component when login is required
Header component:
- Contains BibleReference component
Footer component:
Drawer component (hamburger menu):
TranslationSettings component:
- Prompts for organization and language
ResourceCard component:
- Card that displays translationHelps content
ScriptureCard component:
- Card that displays scripture content
AuthContext context:
- Initializes the authentication context (defined in gitea-react-toolkit)
StoreContext context:
- Manages and persists application state data into local storage
useLocalStorage - custom hook that persists generic application data into local storage
useUserLocalStorage - custom hook that application data for logged in user into local storage