livepeer/livepeerjs

View on GitHub
packages/chroma/src/VideoPlayer/__snapshots__/index.test.js.snap

Summary

Maintainability
Test Coverage
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`should render as expected 1`] = `
<div
  class="video-react-controls-enabled video-react-paused video-react-fluid video-react-user-active video-react-workinghover video-react"
  style="padding-top:56.25%"
  tabindex="-1"
>
  <video
    class="video-react-video"
    muted=""
    playsinline=""
    preload="auto"
  />
  <button
    aria-live="polite"
    class="video-react-big-play-button video-react-big-play-button-center big-play-button-hide"
    tabindex="0"
    type="button"
  >
    <span
      class="video-react-control-text"
    >
      Play Video
    </span>
  </button>
  <div
    class="video-react-control-bar"
  >
    <button
      class="video-react-play-control video-react-control video-react-button video-react-paused"
      tabindex="0"
    >
      <span
        class="video-react-control-text"
      >
        Play
      </span>
    </button>
    <div
      class="video-react-volume-menu-button-horizontal video-react-vol-3 video-react-volume-menu-button video-react-menu-button-inline video-react-control video-react-button video-react-menu-button"
      role="button"
      tabindex="0"
    >
      <div
        class="video-react-menu"
      >
        <div
          class="video-react-menu-content"
        >
          <div
            aria-label="volume level"
            aria-valuemax="100"
            aria-valuemin="0"
            aria-valuenow="100.00"
            aria-valuetext="100.00%"
            class="video-react-volume-bar video-react-slider-bar video-react-slider-horizontal video-react-slider"
            tabindex="0"
          >
            <div
              class="video-react-volume-level"
              style="width:100.00%"
            >
              <span
                class="video-react-control-text"
              />
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      class="video-react-current-time video-react-time-control video-react-control"
    >
      <div
        aria-live="off"
        class="video-react-current-time-display"
      >
        <span
          class="video-react-control-text"
        >
          Current Time 
        </span>
        0:00
      </div>
    </div>
    <div
      class="video-react-time-control video-react-time-divider"
      dir="ltr"
    >
      <div>
        <span>
          /
        </span>
      </div>
    </div>
    <div
      class="video-react-duration video-react-time-control video-react-control"
    >
      <div
        aria-live="off"
        class="video-react-duration-display"
      >
        <span
          class="video-react-control-text"
        >
          Duration Time 
        </span>
        0:00
      </div>
    </div>
    <div
      class="video-react-progress-control video-react-control"
    >
      <div
        aria-label="video progress bar"
        aria-valuemax="100"
        aria-valuemin="0"
        aria-valuenow="NaN"
        aria-valuetext="0:00"
        class="video-react-progress-holder video-react-slider-horizontal video-react-slider"
        tabindex="0"
      >
        <div
          class="video-react-play-progress video-react-slider-bar"
          data-current-time="0:00"
          style="width:NaN%"
        >
          <span
            class="video-react-control-text"
          >
            <span>
              Progress
            </span>
            : NaN%
          </span>
        </div>
      </div>
    </div>
    <div
      class="video-react-control"
    >
      <div
        class="menu-container"
        style="display:none"
      >
        <ul>
          <li>
            <button
              class="active"
              data-id="-1"
            >
              auto
            </button>
          </li>
        </ul>
      </div>
      <button
        class="video-react-icon video-react-control video-react-button video-react-icon-settings"
        tabindex="0"
      />
    </div>
    <button
      class="video-react-icon-fullscreen video-react-fullscreen-control video-react-control video-react-button video-react-icon"
      tabindex="0"
      type="button"
    >
      <span
        class="video-react-control-text"
      >
        Non-Fullscreen
      </span>
    </button>
  </div>
</div>
`;