PII Scrub

Purpose

This component provides the ability to detect replace Personal Identifiable Information (PII) with redacted content.

Here is the list of the PII that the plugin will search and redact:

All the combinations of 9 digits and more
Phone number
Canadian serial passport number
Email
Canadian postal code
Any potential user name values added in this format username=theUserValue, username:theUserValue, user=theUserValue, user:theUserValue
Any potential password values added in this format password=thePassValue, password: thePassValue pass=thePassValue, pass:thePassValue

A popup message will inform the user if any field contains personal information and will show the output of the scrubbed data. The user can choose to go back to the form and delete the data manually or to proceed with scrubbing the personal information automatically.

For more details about the scrubbing PII behaviour please check on the wet-boew core helper wb.findPotentialPII.

Use when

Forms might contain Personal Identifiable Information (PII), this plugin will identify and redact this information.

Working example

How to implement

Add the CSS class wb-pii-scrub to the <form> element containing fields you want to scrub.
Add the attribute data-scrub-field to each text field that might contain personal information.
```
<input id="email" name="email" type="email" data-scrub-field />
```

Configuration options

All configuration options of the plugin are controlled by the data-wb-pii-scrub attribute. For example: data-wb-pii-scrub='{ "scrubChar": "XXXXXXX" }'

Option Description Type Default

scrubChar Used to define with what string the PII will be replaced with. String ********

Option	Description	Type	Default
`scrubChar`	Used to define with what string the PII will be replaced with.	String	`********`
`modalTemplate`	Used to define the HTML template for the modal displayed when PII is found in a field. Your template must include the following: The placeholder for PII fields: `<div data-scrub-modal-fields></div>`. This placeholder will be filled with the list of PII fields and their associated label. A cancel button. This button must have the CSS class `popup-modal-dismiss`. For example: `<button type="button" class="btn btn-link btn-block popup-modal-dismiss">Go back and edit comment</button>` A submit button. This button must have the attribute `data-scrub-submit` and the CSS class `popup-modal-dismiss`. For example: `<button type="button" class="btn btn-primary btn-block popup-modal-dismiss" data-scrub-submit>Submit comment</button>`	CSS selector	View working example for default HTML template.

modalTemplate

Used to define the HTML template for the modal displayed when PII is found in a field.

Your template must include the following:

The placeholder for PII fields: <div data-scrub-modal-fields></div>. This placeholder will be filled with the list of PII fields and their associated label.
A cancel button. This button must have the CSS class popup-modal-dismiss. For example: <button type="button" class="btn btn-link btn-block popup-modal-dismiss">Go back and edit comment</button>
A submit button. This button must have the attribute data-scrub-submit and the CSS class popup-modal-dismiss. For example: <button type="button" class="btn btn-primary btn-block popup-modal-dismiss" data-scrub-submit>Submit comment</button>

CSS selector

View working example for default HTML template.

Events

The following are the public events that can be used by implementers or developers.

Event Trigger What it does

wb-init.wb-pii-scrub Triggered manually (e.g., $( ".wb-pii-scrub" ).trigger( "wb-init.wb-pii-scrub" );). Used to manually initialize the wb-pii-scrub plugin

Event	Trigger	What it does
`wb-init.wb-pii-scrub`	Triggered manually (e.g., `$( ".wb-pii-scrub" ).trigger( "wb-init.wb-pii-scrub" );`).	Used to manually initialize the wb-pii-scrub plugin
`wb-ready.wb-pii-scrub` (v4.0.24+)	Triggered automatically after wb-pii-scrub initializes.	Used to identify the element where steps form has initialized (target of the event) `$( document ).on( "wb-ready.wb-pii-scrub", ".wb-pii-scrub", function( event ) {});` `$( ".wb-pii-scrub" ).on( "wb-ready.wb-pii-scrub", function( event ) {});`
`wb-ready.wb` (v4.0.24+)	Triggered automatically when WET has finished loading and executing.	Used to identify when all WET plugins and polyfills have finished loading and executing. `$( document ).on( "wb-ready.wb", function( event ) {});`

wb-ready.wb-pii-scrub (v4.0.24+)

Triggered automatically after wb-pii-scrub initializes.

Used to identify the element where steps form has initialized (target of the event)

$( document ).on( "wb-ready.wb-pii-scrub", ".wb-pii-scrub", function( event ) {});

$( ".wb-pii-scrub" ).on( "wb-ready.wb-pii-scrub", function( event ) {});

wb-ready.wb (v4.0.24+)

Triggered automatically when WET has finished loading and executing.

Used to identify when all WET plugins and polyfills have finished loading and executing.

$( document ).on( "wb-ready.wb", function( event ) {});

Source code

Data Scrub source code on GitHub

Date modified:: 2024-11-19

Language selection

Search and menus

Search