How to use the Coveo Quantic Library
Install Coveo Quantic as a Salesforce unlocked package
- Sign up
- Use your @coveo.com email account. The username can be anything.
- Run
npm install --global @salesforce/cli@2.x
- Optional: Setup CLI autocomplete
- Run
sf plugins update
Optionally install the VSCode Salesforce Extension Pack if you do not want use the equivalent Salesforce cli
commands to setup.
Note Make sure you open the quantic project at the root (/packages/quantic/
) in vscode in order for the extension to work properly.
- Connect to your salesforce developer organization login
- From Setup, enter Dev Hub in the Quick Find box and select Dev Hub.
- To enable Dev Hub, click Enable
- In VS Code, press Command + Shift P, enter sfdx, and select SFDX: Authorize a Dev Hub.
- You can also run this command from the command line.
sf org login web --set-default-dev-hub --alias LWC-Hub
- Running this command opens a browser to the Salesforce login page. Enter your Salesforce username and password. Authorize only once, not every time you work on your project.
- Make sure you are at the root of
packages/quantic
. - Run
npm run scratch:dev
. - You should now have a scratch org with Quantic and the test community deployed. Watch your commandline for the url to the examples community.
Or you can run the individual commands below.
- Make sure you are in the
packages/quantic
root folder. - Run this command to create the default scratch org.
npm run scratch:create
. - In VS Code, press Command + Shift P, enter sfdx, and select SFDX: Create a Default Scratch Org.
- You can also run this command from the command line.
sf org create scratch --set-default --definition-file config/project-scratch-def.json --alias "LWC"
LWC
is an alias for the scratch org that you can use in other Salesforce CLI commands. You can create any alias that you like.
- Run this command from the command line.
sf project deploy start --source-dir force-app/main
.
Example components are available as a Salesforce community (Digital Experience) allowing you to experiment with Quantic components.
To setup the community in the LWC
scratch org, run:
npm run setup:examples
This script creates, configures, and deploys everything required to have fully working examples. The community URL is provided at the end of the script output, as in the following example:
...
The 'Quantic Examples' community is ready, you can access it at the following URL:
https://your-salesforce-scratch-org-instance.force.com/examples
To open Cypress, run:
npm run e2e:watch
Once the community has been deployed, you can deploy the main
or example
components only when needed. To do so, run:
npm run deploy:main
npm run deploy:examples
Note Before attempting to run Cypress tests, make sure the Quantic Examples
community is deployed as described in the previous section.
To learn how to add tests, see adding tests.
- All the tests will need to be under folder
cypress/integration
.
To open Cypress in browser mode, run:
npm run e2e:watch
To run Cypress tests directly in your console, run:
npm run e2e
To get the detailed report, run:
npm run e2e:detailed
To run LWC unit tests directly in your console, run:
npm run test:unit
To run specific file/components LWC unit tests directly in your console, run:
npm run test:unit -p force-app/main/default/lwc/nameOfComponent/
After you have cloned the repository and have run npm install
, run the following commands:
npm run build
sf project deploy start --source-dir force-app/main/default
sf project deploy start --metadata LightningComponentBundle
--metadata LightningComponentBundle
can be changed for different types of "resources". To know which name, check the relatedmeta.xml
file for each type of resource.- Create new web components. In VS Code, press Command + Shift P, enter sfdx, and select SFDX: Create Lightning Web Component.
- lwc.dev
- Components reference. Make sure you stay in the "Lightning web components section". Aura does not apply. Aura is the older UI library that is being deprecated by Salesforce.
- Lightning design system. Reference for styling, CSS utilities, icons, and more.