This custom component for the Now Experience provides a very intuitive way to visualize the progress of a record in ServiceNow. It was built to be very easily configured in UI Builder
The component supports two modes:
- Static Mode: Manually configure a list of stages and set the currently active stage. This mode is suitable for predefined, non-dynamic workflows.
- Record Mode: Specify a table and the
sysId
of a record. The component will automatically fetch the list of stages and the current stage based on the record's data.
Choose from three sizes to ensure the component fits various layouts:
- Small
- Medium
- Large
-
Static Mode:
- Define your own list of stages.
- Set the
currentStage
property to indicate the active stage.
-
Record Mode:
- Ensure the specified
table
contains a field namedstage
of the type 'workflow', with a list of stages defined. - The component fetches these stages and the current stage from the record automatically.
- Ensure the specified
These configuration options allow the Milestone Tracker to be versatile, fitting different scenarios within ServiceNow, adaptable to both static and dynamic workflows.
-
Install Node version v16.
- It's the version supported by the ServiceNow CLI
-
Now CLI @26.5.0
- Install ServiceNow CLI Download from the ServiceNow App Store
-
Configure the ServiceNow CLI to communicate with a ServiceNow instance
snc configure profile set
-
Add ServiceNow CLI UI Component
snc extension add --name ui-component
-
You may need to run this command if you get disconnected from your instance
snc ui-component login {instance_url} basic {user_name} {password}
-
Fork this repo into your GitHub account.
- You can fork any repo by clicking the fork button in the upper right hand corner of a repo page.
-
Clone the fork of your repo, so you can edit the contents locally
git clone <repo url>
-
Install the required components
npm install
-
Test the component locally
snc ui-component develop --open
-
Deploy the component to a ServiceNow instance
snc ui-component deploy --force
-
Make edits to your local cloned copy of the repo on your computer
-
Add, commit and push those edits back to your fork on GitHub
-
Suggest the changes that you made, to be added to the origianl repo using a pull request
. Run the following command
snc extension update --name ui-component