Save consent method ("accept", "reject", "save", etc.) to fides_consent cookie as extra metadata

CHANGELOG.md

@@ -26,9 +26,8 @@ The types of changes are:
 
 ### Changed
 - Upgrade to use Fideslang `3.0.0` and remove associated concepts [#4502](https://github.com/ethyca/fides/pull/4502)
-
-### Changed
 - `fides.js` now sets `supportsOOB` to `false` [#4516](https://github.com/ethyca/fides/pull/4516)
+- Save consent method ("accept", "reject", "save", etc.) to `fides_consent` cookie as extra metadata [#4529](https://github.com/ethyca/fides/pull/4529)
 
 ## [2.26.0](https://github.com/ethyca/fides/compare/2.25.0...main)
 

clients/admin-ui/src/types/api/models/ConsentMethod.ts

@@ -6,7 +6,7 @@
  * An enumeration.
  */
 export enum ConsentMethod {
-  BUTTON = "button",
+  BUTTON = "button", // deprecated- keeping for backwards-compatibility
   REJECT = "reject",
   ACCEPT = "accept",
   SAVE = "save",

clients/fides-js/__tests__/lib/cookie.test.ts

@@ -3,6 +3,7 @@ import * as uuid from "uuid";
 import { CookieAttributes } from "typescript-cookie/dist/types";
 import {
   CookieKeyConsent,
+  CookieMeta,
   FidesCookie,
   getOrMakeFidesCookie,
   isNewFidesCookie,
@@ -96,6 +97,7 @@ describe("getOrMakeFidesCookie", () => {
     it("makes and returns a default cookie", () => {
       const cookie: FidesCookie = getOrMakeFidesCookie();
       expect(cookie.consent).toEqual({});
+      expect(cookie.fides_meta.consentMethod).toEqual(undefined);
       expect(cookie.fides_meta.createdAt).toEqual(MOCK_DATE);
       expect(cookie.fides_meta.updatedAt).toEqual("");
       expect(cookie.identity.fides_user_device_id).toEqual(MOCK_UUID);
@@ -109,23 +111,47 @@ describe("getOrMakeFidesCookie", () => {
     const SAVED_CONSENT = { data_sales: false, performance: true };
 
     describe("in v0.9.0 format", () => {
-      const V090_COOKIE = JSON.stringify({
+      const V090_COOKIE_OBJECT: FidesCookie = {
         consent: SAVED_CONSENT,
         identity: { fides_user_device_id: SAVED_UUID },
         fides_meta: {
           createdAt: CREATED_DATE,
           updatedAt: UPDATED_DATE,
           version: "0.9.0",
         },
-      });
-      beforeEach(() => mockGetCookie.mockReturnValue(V090_COOKIE));
+        tcf_consent: {},
+      };
 
       it("returns the saved cookie", () => {
+        mockGetCookie.mockReturnValue(JSON.stringify(V090_COOKIE_OBJECT));
+        const cookie: FidesCookie = getOrMakeFidesCookie();
+        expect(cookie.consent).toEqual(SAVED_CONSENT);
+        expect(cookie.fides_meta.consentMethod).toEqual(undefined);
+        expect(cookie.fides_meta.createdAt).toEqual(CREATED_DATE);
+        expect(cookie.fides_meta.updatedAt).toEqual(UPDATED_DATE);
+        expect(cookie.identity.fides_user_device_id).toEqual(SAVED_UUID);
+        expect(cookie.tcf_consent).toEqual({});
+      });
+
+      it("returns the saved cookie including optional fides_meta details like consentMethod", () => {
+        // extend the cookie object with some extra details on fides_meta
+        const extendedFidesMeta: CookieMeta = {
+          ...V090_COOKIE_OBJECT.fides_meta,
+          ...{ consentMethod: "accept", otherMetadata: "foo" },
+        };
+        const cookieObject = {
+          ...V090_COOKIE_OBJECT,
+          ...{ fides_meta: extendedFidesMeta },
+        };
+        mockGetCookie.mockReturnValue(JSON.stringify(cookieObject));
         const cookie: FidesCookie = getOrMakeFidesCookie();
         expect(cookie.consent).toEqual(SAVED_CONSENT);
+        expect(cookie.fides_meta.consentMethod).toEqual("accept");
+        expect(cookie.fides_meta.otherMetadata).toEqual("foo");
         expect(cookie.fides_meta.createdAt).toEqual(CREATED_DATE);
         expect(cookie.fides_meta.updatedAt).toEqual(UPDATED_DATE);
         expect(cookie.identity.fides_user_device_id).toEqual(SAVED_UUID);
+        expect(cookie.tcf_consent).toEqual({});
       });
     });
 
@@ -137,8 +163,10 @@ describe("getOrMakeFidesCookie", () => {
       it("returns the saved cookie and converts to new 0.9.0 format", () => {
         const cookie: FidesCookie = getOrMakeFidesCookie();
         expect(cookie.consent).toEqual(SAVED_CONSENT);
+        expect(cookie.fides_meta.consentMethod).toEqual(undefined);
         expect(cookie.fides_meta.createdAt).toEqual(MOCK_DATE);
         expect(cookie.identity.fides_user_device_id).toEqual(MOCK_UUID);
+        expect(cookie.tcf_consent).toEqual({});
       });
     });
   });
@@ -154,6 +182,18 @@ describe("saveFidesCookie", () => {
     expect(cookie.fides_meta.updatedAt).toEqual(MOCK_DATE);
   });
 
+  it("saves optional fides_meta details like consentMethod", () => {
+    const cookie: FidesCookie = getOrMakeFidesCookie();
+    cookie.fides_meta.consentMethod = "dismiss";
+    saveFidesCookie(cookie);
+    expect(mockSetCookie.mock.calls).toHaveLength(1);
+    expect(mockSetCookie.mock.calls[0][0]).toEqual("fides_consent"); // name
+    const cookieValue = mockSetCookie.mock.calls[0][1];
+    const cookieParsed = JSON.parse(cookieValue);
+    expect(cookieParsed.fides_meta).toHaveProperty("consentMethod");
+    expect(cookieParsed.fides_meta.consentMethod).toEqual("dismiss");
+  });
+
   it("sets a cookie on the root domain with 1 year expiry date", () => {
     const cookie: FidesCookie = getOrMakeFidesCookie();
     saveFidesCookie(cookie);
@@ -274,19 +314,23 @@ describe("isNewFidesCookie", () => {
   });
 
   describe("when a saved cookie exists", () => {
+    const CONSENT_METHOD = "accept";
     const CREATED_DATE = "2022-12-24T12:00:00.000Z";
     const UPDATED_DATE = "2022-12-25T12:00:00.000Z";
     const SAVED_UUID = "8a46c3ee-d6c3-4518-9b6c-074528b7bfd0";
     const SAVED_CONSENT = { data_sales: false, performance: true };
-    const V090_COOKIE = JSON.stringify({
+    const V090_COOKIE_OBJECT: FidesCookie = {
       consent: SAVED_CONSENT,
       identity: { fides_user_device_id: SAVED_UUID },
       fides_meta: {
+        consentMethod: CONSENT_METHOD,
         createdAt: CREATED_DATE,
         updatedAt: UPDATED_DATE,
         version: "0.9.0",
       },
-    });
+      tcf_consent: {},
+    };
+    const V090_COOKIE = JSON.stringify(V090_COOKIE_OBJECT);
     beforeEach(() => mockGetCookie.mockReturnValue(V090_COOKIE));
 
     it("returns false for saved cookies", () => {

clients/fides-js/src/components/ConsentButtons.tsx

@@ -99,22 +99,22 @@ export const NoticeConsentButtons = ({
 
   const handleAcceptAll = () => {
     onSave(
-      ConsentMethod.accept,
+      ConsentMethod.ACCEPT,
       notices.map((n) => n.notice_key)
     );
   };
 
   const handleRejectAll = () => {
     onSave(
-      ConsentMethod.reject,
+      ConsentMethod.REJECT,
       notices
         .filter((n) => n.consent_mechanism === ConsentMechanism.NOTICE_ONLY)
         .map((n) => n.notice_key)
     );
   };
 
   const handleSave = () => {
-    onSave(ConsentMethod.save, enabledKeys);
+    onSave(ConsentMethod.SAVE, enabledKeys);
   };
 
   if (isAcknowledge) {

clients/fides-js/src/components/notices/NoticeOverlay.tsx

@@ -135,7 +135,7 @@ const NoticeOverlay: FunctionComponent<OverlayProps> = ({
   }, [cookie, options.debug]);
 
   const handleDismiss = useCallback(() => {
-    handleUpdatePreferences(ConsentMethod.dismiss, initialEnabledNoticeKeys);
+    handleUpdatePreferences(ConsentMethod.DISMISS, initialEnabledNoticeKeys);
   }, [handleUpdatePreferences, initialEnabledNoticeKeys]);
 
   if (!experience.experience_config) {

clients/fides-js/src/components/tcf/TcfConsentButtons.tsx

@@ -48,7 +48,7 @@ export const TcfConsentButtons = ({
         ...(experience.tcf_system_legitimate_interests || []),
       ]),
     };
-    onSave(ConsentMethod.accept, allIds);
+    onSave(ConsentMethod.ACCEPT, allIds);
   };
   const handleRejectAll = () => {
     const emptyIds: EnabledIds = {
@@ -60,7 +60,7 @@ export const TcfConsentButtons = ({
       vendorsConsent: [],
       vendorsLegint: [],
     };
-    onSave(ConsentMethod.reject, emptyIds);
+    onSave(ConsentMethod.REJECT, emptyIds);
   };
 
   return (

clients/fides-js/src/components/tcf/TcfOverlay.tsx

@@ -331,7 +331,7 @@ const TcfOverlay: FunctionComponent<OverlayProps> = ({
   }, [cookie, options.debug]);
 
   const handleDismiss = useCallback(() => {
-    handleUpdateAllPreferences(ConsentMethod.dismiss, initialEnabledIds);
+    handleUpdateAllPreferences(ConsentMethod.DISMISS, initialEnabledIds);
   }, [handleUpdateAllPreferences, initialEnabledIds]);
 
   if (!experience.experience_config) {
@@ -415,7 +415,7 @@ const TcfOverlay: FunctionComponent<OverlayProps> = ({
                 <Button
                   buttonType={ButtonType.SECONDARY}
                   label={experience.experience_config?.save_button_label}
-                  onClick={() => onSave(ConsentMethod.save, draftIds)}
+                  onClick={() => onSave(ConsentMethod.SAVE, draftIds)}
                   className="fides-save-button"
                 />
               }

clients/fides-js/src/lib/consent-types.ts

@@ -420,13 +420,13 @@ export enum ButtonType {
 }
 
 export enum ConsentMethod {
-  button = "button", // deprecated- keeping for backwards-compatibility
-  reject = "reject",
-  accept = "accept",
-  save = "save",
-  dismiss = "dismiss",
-  gpc = "gpc",
-  individual_notice = "api",
+  BUTTON = "button", // deprecated- keeping for backwards-compatibility
+  REJECT = "reject",
+  ACCEPT = "accept",
+  SAVE = "save",
+  DISMISS = "dismiss",
+  GPC = "gpc",
+  INDIVIDUAL_NOTICE = "individual_notice",
 }
 
 export type PrivacyPreferencesRequest = {

clients/fides-js/src/lib/events.ts

@@ -27,14 +27,21 @@ declare global {
   }
 }
 
+/**
+ * Defines the type of "extra" details that can be optionally added to certain
+ * events. This is intentionally vague, but constrained to be basic (primitive)
+ * values for simplicity.
+ */
+export type FidesEventExtraDetails = Record<string, string | number | boolean>;
+
 /**
  * Defines the properties available on event.detail. Currently the FidesCookie
  * and an extra field `meta` for any other details that the event wants to pass
  * around.
  */
 export type FidesEventDetail = FidesCookie & {
   debug?: boolean;
-  extraDetails?: Record<string, string | boolean>;
+  extraDetails?: FidesEventExtraDetails;
 };
 
 export type FidesEvent = CustomEvent<FidesEventDetail>;
@@ -59,7 +66,7 @@ export const dispatchFidesEvent = (
   type: FidesEventType,
   cookie: FidesCookie,
   debug: boolean,
-  extraDetails?: Record<string, string | boolean>
+  extraDetails?: FidesEventExtraDetails
 ) => {
   if (typeof window !== "undefined" && typeof CustomEvent !== "undefined") {
     const event = new CustomEvent(type, {

clients/fides-js/src/lib/initialize.ts

@@ -134,7 +134,7 @@ const automaticallyApplyGPCPreferences = ({
     updateConsentPreferences({
       consentPreferencesToSave,
       experience: effectiveExperience,
-      consentMethod: ConsentMethod.gpc,
+      consentMethod: ConsentMethod.GPC,
       options: fidesOptions,
       userLocationString: fidesRegionString || undefined,
       cookie,

clients/fides-js/src/lib/preferences.ts

@@ -13,7 +13,7 @@ import {
   removeCookiesFromBrowser,
   saveFidesCookie,
 } from "./cookie";
-import { dispatchFidesEvent } from "./events";
+import { dispatchFidesEvent, FidesEventExtraDetails } from "./events";
 import { patchUserPreference } from "../services/api";
 import { TcfSavePreferences } from "./tcf/types";
 
@@ -83,9 +83,13 @@ export const updateConsentPreferences = async ({
   tcf?: TcfSavePreferences;
   updateCookie: (oldCookie: FidesCookie) => Promise<FidesCookie>;
 }) => {
-  // 1. Update the cookie object based on new preferences
+  // Collect any "extra" details that should be recorded on the cookie & event
+  const extraDetails: FidesEventExtraDetails = { consentMethod };
+
+  // 1. Update the cookie object based on new preferences & extra details
   const updatedCookie = await updateCookie(cookie);
   Object.assign(cookie, updatedCookie);
+  Object.assign(cookie.fides_meta, extraDetails); // save extra details to meta (i.e. consentMethod)
 
   // 2. Update the window.Fides object
   debugLog(options.debug, "Updating window.Fides");
@@ -131,5 +135,5 @@ export const updateConsentPreferences = async ({
   }
 
   // 6. Dispatch a "FidesUpdated" event
-  dispatchFidesEvent("FidesUpdated", cookie, options.debug, { consentMethod });
+  dispatchFidesEvent("FidesUpdated", cookie, options.debug, extraDetails);
 };

clients/privacy-center/components/consent/NoticeDrivenConsent.tsx

@@ -199,7 +199,7 @@ const NoticeDrivenConsent = () => {
       preferences,
       user_geography: region,
       privacy_experience_id: experience?.id,
-      method: ConsentMethod.BUTTON,
+      method: ConsentMethod.SAVE,
       code: verificationCode,
     };
 
@@ -232,6 +232,7 @@ const NoticeDrivenConsent = () => {
     const consentCookieKey: CookieKeyConsent = Object.fromEntries(noticeKeyMap);
     window.Fides.consent = consentCookieKey;
     const updatedCookie = { ...cookie, consent: consentCookieKey };
+    updatedCookie.fides_meta.consentMethod = ConsentMethod.SAVE; // include the consentMethod as extra metadata
     saveFidesCookie(updatedCookie);
     toast({
       title: "Your consent preferences have been saved",