Function wrapFn

  • wrapFn(apis, blocker, manager, fn, checkExecution, settings?): Fn | Fn[]

  • Wrap any function into a consent-awaiting function. This allows you to e.g. overwrite every function a WordPress theme or plugin is exposing to window object.

    Learn usage by example

    A plugin exposes the following function which loads a Google Map to window:

    <script consent-skip-blocker="1">
      window.mynested = {
        another: {
          loadGoogleMaps: (when) => {
            console.log("I am loading https://google.com/maps");
          }
        }
      }

      jQuery(() => window.mynested.another.loadGoogleMaps("now"));
    </script>

    We can now override this method with the help of idx and delay of the console.log until consent for Google Maps is given:

    wrapFn(
        {
            object: idx(window, (window) => window.mynested.another),
            key: "loadGoogleMaps"
        },
        ["unblock", "https://google.com/maps"]
    );

    The example above can also be used in the following way to check for blocker rules for the given function body:

    wrapFn(
        {
            object: idx(window, (window) => window.mynested.another),
            key: "loadGoogleMaps"
        },
        "functionBody"
    );

    The above examples determine the consent by a defined Content Blocker. But you can also wait for consent by a defined service with the help of the consent API to check for a technical definition (HTTP Cookie, LocalStorage, ...):

    wrapFn(
        {
            object: idx(window, (window) => window.mynested.another),
            key: "loadGoogleMaps"
        },
        ["consent", "http", "__SECURE", "*"]
    );

    And for the advanced usages, you can simply return your own boolean or Promise by passing your custom checker:

    wrapFn(
        {
            object: idx(window, (window) => window.mynested.another),
            key: "loadGoogleMaps"
        },
        () => {
            return new Promise((resolve) => {
                // [...]
            });
        }
    );

    If you are invoking wrapFn at the very beginning of your HTML and you do not know, when the function which should be overwritten is available, you can pass a function to object so it gets retried to overwrite on interactive and complete state:

    wrapFn(
        {
            object: () => idx(window, (window) => window.mynested.another),
            key: "loadGoogleMaps"
        },
        () => {
            return new Promise((resolve) => {
                // [...]
            });
        }
    );

    Parameters

    • apis: Apis
    • blocker: BlockerDefinition[]
    • manager: CookieConsentManager<any>
    • fn: Fn | FnOverwriteObject | FnOverwriteObject[]

      The function(s) we want to override. If you pass a function you need to implement the overriding for the original function yourself. Otherwise you can pass an object defining the object itself and the appropriate key which holds the function so it gets overwritten automatically.

    • checkExecution: Promise<any> | ((args) => boolean | Promise<void>) | ["consent", typeOrIdOrUniqueName: string | number, name?: string, host?: string] | ["consentAll", technicalDefinitions: [typeOrIdOrUniqueName: string | number, name?: string, host?: string][]] | ["consentSync", typeOrIdOrUniqueName: string | number, name?: string, host?: string] | ["unblock", url: string, options?: HTMLElement | Options] | "functionBody"

      Allows you to define a function which needs to return a boolean which allows synced execution. If the return is a Promise it will return the Promise immediately, when the Promise gets resolved the original function gets invoked.

    • settings: {
          failedSyncReturnValue?: boolean;
          skipRetry?: boolean;
      } = {}
      • Optional failedSyncReturnValue?: boolean
      • Optional skipRetry?: boolean

    Returns Fn | Fn[]

    Function which calls original function when consent is given (depending on checkExecution) or undefined if an undefined function was passed as argument.

Settings

Member Visibility

Theme

On This Page

Learn usage by example