Tutorial — Frontend Only — Step 4 of 6
Events
Subscribe to consenti: events and gate code on consent.
Consenti fires typed consenti:-prefixed events at every consent lifecycle step. Subscribe to whichever ones your integration needs, via widget.on() — each snippet below is independent, so copy only what you use.
consentSubmitted — a decision was saved
ts
// Returning visitors — check existing consent on load
widget.onReady(() => {
if (widget.isCookieGranted('analytics')) initAnalytics()
if (widget.isCookieGranted('marketing')) initAds()
})
// New submission this session — typed on()/off() API
widget.on('consentSubmitted', ({ consentJson, consentAction }) => {
if (consentJson.analytics === 'granted') initAnalytics()
console.log('Action:', consentAction) // 'accept_all' | 'reject_all' | 'custom' | 'update'
})bannerInitialized — widget finished deciding whether to show
ts
widget.on('bannerInitialized', ({ complianceGroup, hasExistingConsent, willShow }) => {
console.log('Compliance group:', complianceGroup, '— will show banner:', willShow)
})bannerVisibility / modalVisibility — UI shown or hidden
ts
widget.on('bannerVisibility', ({ visible, variant }) => {
console.log(variant, 'banner is now', visible ? 'visible' : 'hidden')
})
widget.on('modalVisibility', ({ visible }) => {
console.log('Preference modal is now', visible ? 'open' : 'closed')
})consentBeingSubmitted — fires just before the save
ts
widget.on('consentBeingSubmitted', ({ consentJson, consentAction }) => {
// Runs before the cookie is written / API call is made — useful for a loading spinner
console.log('About to save:', consentAction)
})parentalConsentRequired — COPPA age gate declined
ts
widget.on('parentalConsentRequired', ({ parentalConsentToken, visitorId }) => {
// Send parentalConsentToken through your own parental-consent flow (email, verification, etc.)
sendParentalConsentEmail(visitorId, parentalConsentToken)
})See COPPA for the full age-gate flow this event belongs to.
Raw window.addEventListener('consenti:consentSubmitted', ...) calls work too, for every event — see the full Events reference for every event name and payload shape.