formscanner.js is a JavaScript console tool for quick disection of ServiceNow forms. I've designed this to be used as a "snippet" in Chrome devtools or in Firefox's Scratchpad.
formscanner.js works equally well with Service Portal's "form" widget as it does with standard forms in ServiceNow's platform view.
Run Snippets Of Code From Any Page - Chrome
There a four base functions exposed through the "fs" object in the browser console.
The fieldChart function gives you a complete mapping of the form's field labels, field names, values, types, and references. This function leverages the browser's console.table() function to display the results. Chrome gives you the ability to sort the table by clicking on any of the column headers. At this point, that functionality is not supported in Firefox.
fs.fieldChart();
Understanding how a form is constructed in ServiceNow can be key to troubleshooting display issues. The getSections function of formscanner.js takes all the difficulty out of the process by querying the ServiceNow instance for you and opening a new tab which lists all of the current form sections. Once the "Form Sections" tab opens, you can open any of the records to view the form section elements that it contains.
fs.getSections();
The searchScripts function, allows you to enter any field name on the form and get a complete list of the UI Policies, Client Scripts, and/or Business Rules that may be making changes to the field.
searchScripts searches the following locations for any mention of the selected field:
- Client Script "Script" fields
- UI Action "Field name" fields
- UI Policy "Execute if true" and "Execute if false" fields
- Business Rules "Script" fields
- Business Rules "Set field values" field
fs.searchScripts('caller_id');
breakOnChange allows you to select a field to monitor for changes to CSS, HTML element attributes, HTML child elements, and field values. Monitoring a field means that you set a break point on any of these changes.
Example on the incident form:
fs.breakOnChange('state', true);
If you're looking to break on changes of other DOM elements, then set the second parameter of the breakOnChange function to false, and use a CSS selector for the first parameter.
Example:
fs.breakOnChange('#add_icon', false);
Removes any break points that have been applied by the breakOnChange function.
fs.disableBreakPoint();
parseURL is a utility function which may prove useful not just while troubleshooting form issues, but throughout the entire ServiceNow platform. ServiceNow URLs can become quite long. The parseURL function will quickly decode an encoded URL and display all of the URL parameter names and values. This function also leverages the console.table() function to display the results.
fs.parseURL();