In order to propose a change or request new feature we recommend filling the Feature request.
We track public bugs in GitHub Issues. If you would like to report one we recommend filling the Bug report.
-
Install the dependecies using
yarn
. This will also bootstrap a monorepo installing dependencies inside each package and linking them together. -
Build the libraries using
yarn build
at the top level or inside single package. -
Start watch mode for all of the adapters packages running
yarn start packages
. -
Start the example apps showcasing the usage of components for each framework using
yarn start examples
. -
Start watch mode for the given adapter with its example app running
yarn start vue/react/angular
.
This project uses lerna to manage versions and publishing. It uses locked semantic versioning so each package has the same version at the time. You don't need and shouldn't manullay update touched packages versions. Changes will be published as soon as the next release will be rolled out. In order to properly update all packages to a new version checkout to master
branch and run yarn lerna version
. It will ask about update type and if accepted update all packages and push tagged commit with changes in package*.json
files.
The project is set up with a code quality tools like prettier
, eslint
and manypkg
. They are being automatically run against changed files on pre-commit
hook.
Submit all changes directly to the master
branch. We don’t use separate branches for development or for upcoming releases.
This project uses a GitHub Actions setup to run on each commit push
which triggers lint
, build
, test
and e2e
scripts. Checks must pass in order to unlock merging.
project
|
└─── packages
| └─── widget-core // source of @livechat/widget-core
| | └─── src/__tests__
| └─── widget-vue // source of @livechat/widget-vue
| | └─── src/composition/__tests__
| └─── widget-react // source of @livechat/widget-react
| | └─── src/hooks/__tests__
| └─── widget-angular // source of @livechat/widget-angular
| └─── src/services/__tests__
|
└─── examples
| └─── vue // example Vue app
| └─── react // example React app
| └─── angular // example Angular app
|
└─── e2e // set of e2e tests run on `examples`
|
└─── scripts // CLI commands used in root package.json scripts
In order to manually test introduced changes, use one of the example apps for the framework whcih package you are changing. It contains ready to use setup for testing basic functionalities. If you have added something new, please make sure to extend the example with possibility to visually test your changes.
Packages contain a suite of unit tests dedicated for their core functionalities. Whenever you make change or introduce some new functionality, please make sure that existing tests pass and that the coverage remains at the same level.
- To run tests use:
yarn test
- Tests are located in:
packages/**/src/**/__tests__
- In order to verify the current coverage use:
yarn test -- --coverage
In order to make sure that the packages are all in sync and their core functionalities are working, we have created a suite of end-to-end tests based on the prepared examples
. They simply navigate to the URL of each example in the repository and validate the Chat Widget presence and related data.
- To run tests use:
yarn e2e
- Tests are located in:
e2e
File | % Stmts | % Branch | % Funcs | % Lines |
---|---|---|---|---|
All files | 100 | 100 | 100 | 100 |
assign-configuration.ts | 100 | 100 | 100 | 100 |
assign-customere-data.ts | 100 | 100 | 100 | 100 |
assign-event-handlers.ts | 100 | 100 | 100 | 100 |
assign-visibility.ts | 100 | 100 | 100 | 100 |
create-js-api.ts | 100 | 100 | 100 | 100 |
create-widget.ts | 100 | 100 | 100 | 100 |
get-data.ts | 100 | 100 | 100 | 100 |
lifecycle.ts | 100 | 100 | 100 | 100 |
File | % Stmts | % Branch | % Funcs | % Lines |
---|---|---|---|---|
All files | 100 | 100 | 100 | 100 |
useWidgetChatData.ts | 100 | 100 | 100 | 100 |
useWidgetCustomerData.ts | 100 | 100 | 100 | 100 |
useWidgetGreeting.ts | 100 | 100 | 100 | 100 |
useWidgetIsReady.ts | 100 | 100 | 100 | 100 |
useWidgetState.ts | 100 | 100 | 100 | 100 |
File | % Stmts | % Branch | % Funcs | % Lines |
---|---|---|---|---|
All files | 100 | 100 | 100 | 100 |
useWidgetChatData.ts | 100 | 100 | 100 | 100 |
useWidgetCustomerData.ts | 100 | 100 | 100 | 100 |
useWidgetGreeting.ts | 100 | 100 | 100 | 100 |
useWidgetIsReady.ts | 100 | 100 | 100 | 100 |
useWidgetState.ts | 100 | 100 | 100 | 100 |
File | % Stmts | % Branch | % Funcs | % Lines |
---|---|---|---|---|
All files | 100 | 100 | 100 | 100 |
WidgetChatData.service.ts | 100 | 100 | 100 | 100 |
WidgetCustomerData.service.ts | 100 | 100 | 100 | 100 |
WidgetGreeting.service.ts | 100 | 100 | 100 | 100 |
WidgetIsReady.service.ts | 100 | 100 | 100 | 100 |
WidgetState.service.ts | 100 | 100 | 100 | 100 |