JSFiddle - React, Tailwind, and code Playground

by sfoster

JavaScript

/**
 * Let's design and implement part of a simple ad blocker. Let's imagine that
 * consumers will create an instance of the AdBlocker class below, passing some
 * sort of data that describes the URLs that should be blocked. Then for each
 * URL they need to load, they'll call a method to determine whether the URL
 * should be blocked.
 *
 * Aside from the constructor and `shouldBlockURL`, please modify the class any
 * way you'd like.
 * 
 * 
 * - Create a class that filters a list of urls given configuration data
 * - Per site, per host, and per file / path
 */
class AdBlocker {
  /**
   * Initializes the AdBlocker instance.
   *
   * @param {???} blockListData
   *   A value that describes URLs to block. What do you think it should look
   *   like?
   */
  constructor(blockListData) {
    // Your code here

  }

  /**
   * Returns whether a given URL should be blocked from loading.
   *
   * @param {string} url
   *   A URL string like "http://example.com/foo/bar.js"
   * @returns {boolean}
   *   Whether the URL should be blocked.
   */
  shouldBlockURL(url) {
    // Your code here
    
    return false;
  }
}

(function test_blocker() {
  // Expected results: URLs and whether they should be blocked
  let testData = [
    {
      url: "http://mozilla.org/",
      shouldBlock: false,
    },
    {
      url: "http://site.com/index.html",
      shouldBlock: false,
    },
    {
      url: "http://site.com/blinking.gif",
      shouldBlock: true,
    },
    {
      url: "http://test.net/index.html",
      shouldBlock: false,
    },
    {
      url: "http://test.net/popup.js",
      shouldBlock: true,
    },
    {
      url: "http://test.net/ads/main.js",
      shouldBlock: true,
    },
    {
      url: "http://test.net/ads/pixel.gif",
      shouldBlock: true,
    },
    {
      url: "http://test.net/ads/promo.html",
      shouldBlock: true,
    },
  ];

  let blockListData = `{
    "site.com": [
      "/blinking.gif",
    ],
    "test.net": [
      "/popup.js",
 ...