Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
   - License, v. 2.0. If a copy of the MPL was not distributed with this
<html>
  <head>
    <meta charset="utf-8"/>
    <title></title>
  </head>
  <body>
    <script>
      "use strict";
      // This file is used to test the injection of performance profiles into a front-end,
      // specifically the mechanism used to inject into profiler.firefox.com. Rather
      // than using some kind of complicated message passing scheme to talk to the test
      // harness, modify the title of the page. The tests can easily read the window
      // title to see if things worked as expected.
      // The following are the titles used to communicate the page's state to the tests.
      // Keep these in sync with any tests that read them.
      const initialTitle = "Waiting on the profile";
      const successTitle = "Profile received";
      const errorTitle = "Error"
      document.title = initialTitle;
      // A function which requests the profile from the browser using the GET_PROFILE
      // WebChannel message.
      function getProfile() {
        return new Promise((resolve, reject) => {
          const requestId = 0;
          function listener(event) {
            window.removeEventListener(
              "WebChannelMessageToContent",
              listener,
              true
            );
            const { id, message } = event.detail;
            if (id !== "profiler.firefox.com" ||
              !message ||
              typeof message !== "object"
            ) {
              console.error(message);
              reject(new Error("A malformed WebChannel event was received."));
              return;
            }
            if (!message.type) {
              console.error(message);
              reject(new Error("The WebChannel event indicates an error."));
              return;
            }
            if (message.requestId === requestId) {
              if (message.type === "SUCCESS_RESPONSE") {
                resolve(message.response);
              } else {
                reject(new Error(message.error));
              }
            }
          }
          window.addEventListener("WebChannelMessageToContent", listener, true);
          window.dispatchEvent(
            new CustomEvent("WebChannelMessageToChrome", {
              detail: JSON.stringify({
                id: "profiler.firefox.com",
                message: { type: "GET_PROFILE", requestId },
              }),
            })
          );
        })
      }
      async function runTest() {
        try {
          // Get the profile.
          const profile = await getProfile();
          // Check that the profile is somewhat reasonable. It should be a gzipped
          // profile, so we can only lightly check some properties about it, and check
          // that it is an ArrayBuffer.
          //
          // After the check, modify the title of the document, so the tab title gets
          // updated. This is an easy way to pass a message to the test script.
          if (
            profile &&
            typeof profile === 'object' &&
            (
              // The popup injects the compressed profile as an ArrayBuffer.
              (profile instanceof ArrayBuffer) ||
              // DevTools injects the profile as just the plain object, although
              // maybe in the future it could also do it as a compressed profile
              Object.keys(profile).includes("threads")
            )
          ) {
            // The profile looks good!
            document.title = successTitle;
          } else {
            // The profile doesn't look right, surface the error to the terminal.
            dump('The gecko profile was malformed in fake-frontend.html\n');
            dump(`Profile: ${JSON.stringify(profile)}\n`);
            // Also to the web console.
            console.error(profile);
            // Report the error to the tab title.
            document.title = errorTitle;
          }
        } catch (error) {
          // Catch any error and notify the test.
          document.title = errorTitle;
          dump('An error was caught in fake-frontend.html\n');
          dump(`${error}\n`);
        }
      }
      runTest();
    </script>
  </body>
</html>