What does cookie blocking mean for your site?

Key Concepts

• Third-party cookies
• First-party cookies
• Cross-site cookies
• Cookie blocking
• Chrome settings
• Incognito mode
• Chrome Flags
• Third-party cookie phaseout flag
• DevTools Network panel
• User journeys
• Site breakage
• Cross-site interactions

Testing for Cookie Blocking

Testing with Browser Settings

• Main Point: The traditional method involves using Chrome settings to block third-party cookies.
• Process:
  1. Navigate to Chrome Settings > Cookies.
  2. Select "Block third-party cookies."
  3. Hard refresh the page to apply the changes.
• Verification:
  • Check for an eye icon in the omnibox indicating blocked sites.
  • Inspect the Application panel to see existing cookies (which need to be cleared manually by right-clicking the origin and selecting "Clear").
  • Verify in the Network panel that no cookies are sent for cross-site requests.
• Example: The video demonstrates this process on a demo page, showing how cross-site cookies are initially set and then blocked.

Testing with Incognito Mode

• Main Point: Incognito mode blocks third-party cookies but has other side effects, making it less realistic for testing specific cookie behavior.
• Caveats: Incognito mode doesn't just block third-party cookies; it also affects other browser behaviors.
• Use Case: Useful for a quick check but not a comprehensive testing solution.
• Example: Opening the cookie demo page in incognito mode shows no cookies being set in the request.

Testing with the Third-Party Cookie Phaseout Flag

• Main Point: Using the Chrome Flags page to enable the third-party cookie phaseout flag provides a more controlled and realistic testing environment.
• Process:
  1. Navigate to chrome://flags.
  2. Search for "Third-party cookie phaseout."
  3. Select "Enabled" and relaunch Chrome.
• Benefits:
  • Allows for automated testing.
  • Simulates Chrome's behavior when third-party cookies are blocked.
• Verification:
  • The eye icon appears in the omnibox.
  • The Network panel shows no request cookies for cross-site requests.
• Temporary Re-enabling: The eye icon in the omnibox allows users to temporarily re-enable third-party cookies for a site.
  • Click the eye icon and toggle the slider.
  • Cross-site cookies will then appear in the DevTools network panel.
• Command Line Flag: The phaseout flag can also be set when running Chrome from the command line (e.g., using Chrome Canary).
  • chrome --test-third-party-cookie-phaseout
  • Note: This command line flag will not be reflected in the Chrome Flags page.
• Important Note: The Chrome settings page for cookies cannot override the phaseout flag. Even if "Allow third-party cookies" is selected in settings, cookies will still be blocked if the flag is enabled.

Developing a Strategy to Minimize Site Breakage

Auditing and Understanding Cross-Site Interactions

• Main Point: Identify and understand cross-site interactions across your own sites and with third parties.
• Action: Audit your sites to clarify which first and third-party services you're using.
• Benefit: Reduces technical debt and improves page load performance by removing unnecessary tags and embeds.

Compiling Critical User Journeys and Use Cases

• Main Point: Create a checklist of critical user journeys and use cases to test.
• Examples:
  • Embedded content (store finders, video widgets)
  • Site features (rating, bookmarking)
  • Signup and checkout flows
• Outcome: Build a to-do list of things to fix based on the checklist.

Testing and Feedback Collection

• Main Point: Involve internal teams and external testers to test sites without third-party cookies.
• Methods:
  • Ask developers to use sites with third-party cookies blocked.
  • Test across the entire company.
• Feedback Collection:
  • Provide a simple form for staff to report breakage.
  • Create a Chrome extension to collect information.

Integration with Test Suites and QA Processes

• Main Point: Integrate cookie blocking experiments with existing test suites and QA processes.

Communication with Third-Party Providers

• Main Point: Talk to account managers for ads and other third-party content and services.

Notable Quotes

• "Cookies may be blocked by user settings, enterprise policies, or browser design. So you should test your site for breakage where cookies aren't available." - Sam Dutton
• "Incognito mode can be useful, but it does not give you a realistic site experience." - Sam Dutton

Technical Terms

• First-party cookies: Cookies set by the domain of the website being visited.
• Third-party cookies: Cookies set by a domain different from the website being visited. Often used for tracking and advertising.
• Cross-site cookies: Same as third-party cookies.
• Omnibox: Chrome's address bar.
• DevTools: Chrome's built-in developer tools.
• Chrome Flags: Experimental features in Chrome that can be enabled or disabled.

Logical Connections

The video progresses logically from explaining how to test for cookie blocking using different methods (browser settings, incognito mode, Chrome Flags) to outlining a comprehensive strategy for minimizing site breakage when cookies are blocked. It emphasizes the importance of understanding cross-site interactions, compiling critical user journeys, and involving various teams in the testing process.

Synthesis/Conclusion

The video provides a detailed guide on how to test for third-party cookie blocking and develop a strategy to mitigate potential site breakage. It highlights the limitations of using incognito mode for testing and advocates for using the third-party cookie phaseout flag in Chrome Flags for a more realistic and controllable testing environment. The video emphasizes the importance of auditing sites, identifying critical user journeys, and involving internal and external teams in the testing process to ensure a seamless user experience when third-party cookies are blocked. The key takeaway is that proactive testing and strategic planning are crucial for adapting to the evolving privacy landscape and minimizing the impact of cookie blocking on website functionality.