Zaraz Developer Certification Program

This is a single static HTML page running on Cloudflare ⚡️ Pages to showcase Zaraz.

⚠️ NOTE: At the time of publishing the unstyled Zaraz consent and Zaraz debuger are almost unusable in Dark mode. I've set this page to prefer dark-mode to highlight to the Cloudflare developers that this is an issue. 💡 Switch to light-mode.

Tests

Routes:
- 🏠 Home
- 🛍️ Product Category
- 🛒 Checkout - Purchase
- 📦 Product Detail
Events:
- This link has an ID attribute of wanttosubscribenow which should fire a trigger checking "Click ID"s that contain "subscribe" (CSS Selector: [id*='subscribe']).

Worker Variable

This Worker is running at zarazdevelopercertificationprogram.ginetta.workers.dev (it expects a POST from Zaraz).

		
async function pageMap(path) {
  if (path === '/') return 'Home';
  if (path === '/products') return 'Product Category';
  if (path === '/thank-you-page') return 'Checkout - Purchase';
  if (/^\/products\/\w+/.test(path)) return 'Product Detail';
  return '';
}

export default {
  async fetch(request, env) {
    // Parse the Zaraz Context object
    const { system } = await request.json();

    const href = system.page.url.pathname; // URL of the current page
    // console.log(system.page.url, '|', await pageMap(href));
    return new Response(await pageMap(href));
  },
};

Resources

Managed Component

✅ Ready for review on Github