Javascript API to subscribe to "events" for preference changes/initialization/etc

[eastandwestwind]

As a web developer, I want to add the Fides components to my site and have a simple way to subscribe to “events” that are triggered when the consent preferences are either initialized to default values, or updated based on a user’s preferences, so that I can write custom Javascript code to manage tags or enforce consent on my own systems.

Details

We need to provide as much backwards-compatibility as possible with the existing fides.js API, which is a simple read-only window.Fides.consent object that includes the user’s consent preferences

We need to ensure that events are triggered whenever the preferences change, including:

• Initializing the script to “defaults” based on the user’s geolocation
• User saving their preferences from the modal
• User rejecting all notices from the banner
• User accepting all notices from the banner

etc.

AC

• When I’ve added Fides consent to my site, then I can subscribe to Javascript events to be notified when the window.Fides.consent object is initialized
• When I’ve added Fides consent to my site, then I can subscribe to Javascript events to be notified when the window.Fides.consent object is updated by the user (saving preferences from modal, rejecting notices from banner, accepting notices from banner, etc.)

[NevilleS]

I gave this some thought and poked around at other generic JavaScript projects, and it does seem like there are three good options:

1. Using the super normal window.dispatchEvent() function; https://developer.mozilla.org/en-US/docs/Web/Events/Creating_and_triggering_events
2. Providing some React props like onInit, onSave and call those. This only allows for a single listener for each callback so it isn't nearly as flexible as the first option
3. Importing the Node EventEmitter class and emitting events to all subscribed listeners. This supports multiple listeners but adds a lot more code

My preference is to do 1&2: trigger window events for vanilla JS installations, but also provide an explicit callback for React projects that import us. I don't think it's worth adding the EventEmitter module or similar; once you go that direction, it feels better to go all the way and support native ESM imports and React props 👍

[NevilleS]

Closed by #3454

[Roger-Ethyca]

moving to done