// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<StudioHeader /> renders correctly 1`] = `
<header
  className="site-header-desktop"
>
  <a
    className="nav-skip sr-only sr-only-focusable"
    href="#main"
  >
    Skip to main content
  </a>
  <div
    className="container-fluid null"
  >
    <div
      className="nav-container position-relative d-flex align-items-center"
    >
      <img
        alt="edX"
        className="logo"
        src="https://edx-cdn.org/v3/default/logo.svg"
      />
      <nav
        aria-label="Main"
        className="nav main-nav"
      />
      <nav
        aria-label="Secondary"
        className="nav secondary-menu-container align-items-center ml-auto"
      >
        <div
          className="menu null"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <button
            aria-expanded={false}
            aria-haspopup="menu"
            aria-label="Account menu for edX"
            className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
            onClick={[Function]}
          >
            <span
              className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
              style={
                Object {
                  "height": "1.5em",
                  "width": "1.5em",
                }
              }
            >
              <svg
                aria-hidden={true}
                focusable="false"
                height="24px"
                role="img"
                style={
                  Object {
                    "height": "1.5em",
                    "width": "1.5em",
                  }
                }
                version="1.1"
                viewBox="0 0 24 24"
                width="24px"
              >
                <path
                  d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
                  fill="currentColor"
                />
              </svg>
            </span>
            edX
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </button>
        </div>
      </nav>
    </div>
  </div>
</header>
`;

exports[`<StudioHeader /> renders correctly with the optional app menu 1`] = `
<header
  className="site-header-desktop"
>
  <a
    className="nav-skip sr-only sr-only-focusable"
    href="#main"
  >
    Skip to main content
  </a>
  <div
    className="container-fluid null"
  >
    <div
      className="nav-container position-relative d-flex align-items-center"
    >
      <img
        alt="edX"
        className="logo"
        src="https://edx-cdn.org/v3/default/logo.svg"
      />
      <nav
        aria-label="Main"
        className="nav main-nav"
      />
      <nav
        aria-label="App"
        className="nav app-nav"
      >
        <div
          className="menu null"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <a
            aria-expanded={false}
            aria-haspopup="menu"
            className="menu-trigger nav-link d-inline-flex align-items-center"
            onClick={[Function]}
          >
            App Menu
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </a>
        </div>
      </nav>
      <nav
        aria-label="Secondary"
        className="nav secondary-menu-container align-items-center ml-auto"
      >
        <div
          className="menu null"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <button
            aria-expanded={false}
            aria-haspopup="menu"
            aria-label="Account menu for edX"
            className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
            onClick={[Function]}
          >
            <span
              className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
              style={
                Object {
                  "height": "1.5em",
                  "width": "1.5em",
                }
              }
            >
              <svg
                aria-hidden={true}
                focusable="false"
                height="24px"
                role="img"
                style={
                  Object {
                    "height": "1.5em",
                    "width": "1.5em",
                  }
                }
                version="1.1"
                viewBox="0 0 24 24"
                width="24px"
              >
                <path
                  d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
                  fill="currentColor"
                />
              </svg>
            </span>
            edX
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </button>
        </div>
      </nav>
    </div>
  </div>
</header>
`;

exports[`<StudioHeader /> renders correctly with the optional main menu 1`] = `
<header
  className="site-header-desktop"
>
  <a
    className="nav-skip sr-only sr-only-focusable"
    href="#main"
  >
    Skip to main content
  </a>
  <div
    className="container-fluid null"
  >
    <div
      className="nav-container position-relative d-flex align-items-center"
    >
      <img
        alt="edX"
        className="logo"
        src="https://edx-cdn.org/v3/default/logo.svg"
      />
      <nav
        aria-label="Main"
        className="nav main-nav"
      >
        <div
          className="menu nav-item"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <a
            aria-expanded={false}
            aria-haspopup="menu"
            className="menu-trigger nav-link d-inline-flex align-items-center"
            href="https://menu-href-url.org"
            onClick={[Function]}
          >
            Content 1
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </a>
        </div>
        <div
          className="menu nav-item"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <a
            aria-expanded={false}
            aria-haspopup="menu"
            className="menu-trigger nav-link d-inline-flex align-items-center"
            href="https://menu-href-url.org"
            onClick={[Function]}
          >
            Content 2
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </a>
        </div>
        <div
          className="menu nav-item"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <a
            aria-expanded={false}
            aria-haspopup="menu"
            className="menu-trigger nav-link d-inline-flex align-items-center"
            href="https://menu-href-url.org"
            onClick={[Function]}
          >
            Content 3
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </a>
        </div>
      </nav>
      <nav
        aria-label="Secondary"
        className="nav secondary-menu-container align-items-center ml-auto"
      >
        <div
          className="menu null"
          onKeyDown={[Function]}
          onMouseEnter={[Function]}
          onMouseLeave={[Function]}
        >
          <button
            aria-expanded={false}
            aria-haspopup="menu"
            aria-label="Account menu for edX"
            className="menu-trigger btn btn-outline-primary d-inline-flex align-items-center pl-2 pr-3"
            onClick={[Function]}
          >
            <span
              className="avatar overflow-hidden d-inline-flex rounded-circle mr-2"
              style={
                Object {
                  "height": "1.5em",
                  "width": "1.5em",
                }
              }
            >
              <svg
                aria-hidden={true}
                focusable="false"
                height="24px"
                role="img"
                style={
                  Object {
                    "height": "1.5em",
                    "width": "1.5em",
                  }
                }
                version="1.1"
                viewBox="0 0 24 24"
                width="24px"
              >
                <path
                  d="M4.10255106,18.1351061 C4.7170266,16.0581859 8.01891846,14.4720277 12,14.4720277 C15.9810815,14.4720277 19.2829734,16.0581859 19.8974489,18.1351061 C21.215206,16.4412566 22,14.3122775 22,12 C22,6.4771525 17.5228475,2 12,2 C6.4771525,2 2,6.4771525 2,12 C2,14.3122775 2.78479405,16.4412566 4.10255106,18.1351061 Z M12,24 C5.372583,24 0,18.627417 0,12 C0,5.372583 5.372583,0 12,0 C18.627417,0 24,5.372583 24,12 C24,18.627417 18.627417,24 12,24 Z M12,13 C9.790861,13 8,11.209139 8,9 C8,6.790861 9.790861,5 12,5 C14.209139,5 16,6.790861 16,9 C16,11.209139 14.209139,13 12,13 Z"
                  fill="currentColor"
                />
              </svg>
            </span>
            edX
             
            <svg
              aria-hidden={true}
              focusable="false"
              height="16px"
              role="img"
              version="1.1"
              viewBox="0 0 16 16"
              width="16px"
            >
              <path
                d="M7,4 L7,8 L11,8 L11,10 L5,10 L5,4 L7,4 Z"
                fill="currentColor"
                transform="translate(8.000000, 7.000000) rotate(-45.000000) translate(-8.000000, -7.000000) "
              />
            </svg>
          </button>
        </div>
      </nav>
    </div>
  </div>
</header>
`;