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

exports[`TDP Skeleton should render correctly 1`] = `
<DocumentFragment>
  .c7 {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
}

.c8 {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.c18 {
  color: #222222;
  -webkit-letter-spacing: -0.01em;
  -moz-letter-spacing: -0.01em;
  -ms-letter-spacing: -0.01em;
  letter-spacing: -0.01em;
}

.c0 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: #7D7D7D;
  font-size: 16px;
  line-height: 24px;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  margin-bottom: 20px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.c1 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #7D7D7D;
  -webkit-transition-duration: 125ms;
  transition-duration: 125ms;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.c1:hover {
  color: #CECECE;
}

.c17 {
  gap: 16px;
  padding: 24px 0px;
  -webkit-animation: iAjNNh 125ms ease-in;
  animation: iAjNNh 125ms ease-in;
}

.c19 {
  font-size: 28px !important;
}

.c2 {
  border-radius: 12px;
  border-radius: 12px;
  height: 24px;
  width: 50%;
  width: 50%;
  -webkit-animation: fAQEyV 1.5s infinite;
  animation: fAQEyV 1.5s infinite;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  background: linear-gradient( to left, #22222212 25%, rgba(53,53,53,0.07) 50%, #22222212 75% );
  will-change: background-position;
  background-size: 400%;
}

.c13 {
  color: #7D7D7D;
  font-size: 14px;
  min-width: 121px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-top: 24px;
  padding-bottom: 0px;
}

.c12 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.c9 {
  gap: 16px;
  -webkit-animation: iAjNNh 125ms ease-in;
  animation: iAjNNh 125ms ease-in;
}

.c16 {
  background-color: #22222212;
  border: none;
  height: 0.5px;
}

.c31 {
  border-radius: 12px;
  height: 40px;
  width: 40px;
  position: relative;
  margin-top: -18px;
  margin-bottom: -18px;
  margin-left: auto;
  margin-right: auto;
  background-color: #F9F9F9;
  border: 4px solid;
  border-color: #FFFFFF;
  z-index: 2;
}

.c33 {
  display: -webkit-inline-box;
  display: -webkit-inline-flex;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.c32 {
  position: absolute;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin: 0;
}

.c23 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 8px;
  border: 1px solid #22222212;
  border-radius: 16px;
  background-color: #FFFFFF;
}

.c27 {
  background-color: #F9F9F9;
  border-radius: 4px;
  height: 56px;
  width: 60px;
}

.c29 {
  background-color: #F9F9F9;
  border-radius: 16px;
  height: 56px;
  width: 100px;
}

.c34 {
  background-color: #F9F9F9;
  border-radius: 16px;
  height: 56px;
  width: 100%;
}

.c28 {
  background-color: #22222212;
  height: 36px;
}

.c24 {
  padding: 8px;
}

.c26 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.c25 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
  flex-flow: column;
  background-color: #F9F9F9;
  border-radius: 16px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 30px;
  padding: 48px 12px;
}

.c30 {
  position: relative;
}

.c3 {
  height: 16px;
  width: 180px;
}

.c10 {
  height: 32px;
  border-radius: 8px;
}

.c4 {
  width: 169px;
}

.c5 {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

.c6 {
  height: 36px;
  width: 136px;
}

.c11 {
  width: 120px;
}

.c14 {
  width: 80px;
  margin-bottom: 4px;
}

.c15 {
  width: 116px;
}

.c20 {
  margin-bottom: 6px;
  width: 100%;
}

.c22 {
  width: 120px;
}

.c21 {
  width: 50%;
}

@media screen and (max-width:640px) {
  .c13 {
    min-width: 168px;
  }
}

<span
    class=""
    style="display: contents;"
  >
    <span
      class=" _dsp_contents"
    >
      <span
        class=" t_light _dsp_contents is_Theme"
      >
        <div
          class="_pt-_lg_0px _pr-_lg_1316331137 _pl-_lg_1316331137 _pb-_lg_52px _flexDirection-_xl_column _alignItems-_xl_center _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _justifyContent-center _width-10037 _gap-80px _pt-1316330300 _pb-1316330300 _pr-1316330269 _pl-1316330269"
        >
          <div
            class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexDirection-column _maxWidth-780px _overflowX-hidden _overflowY-hidden _width-10037 _flexGrow-1 _flexShrink-1"
          >
            <nav
              aria-label="breadcrumb-nav"
              class="c0"
            >
              <a
                class="c1"
                href="/explore/ethereum"
              >
                Explore 
                <svg
                  fill="none"
                  height="14"
                  stroke="currentColor"
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  stroke-width="2"
                  viewBox="0 0 24 24"
                  width="14"
                  xmlns="http://www.w3.org/2000/svg"
                >
                  <polyline
                    points="9 18 15 12 9 6"
                  />
                </svg>
              </a>
              <a
                class="c1"
                href="/explore/tokens/ethereum"
              >
                Tokens 
                <svg
                  fill="none"
                  height="14"
                  stroke="currentColor"
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  stroke-width="2"
                  viewBox="0 0 24 24"
                  width="14"
                  xmlns="http://www.w3.org/2000/svg"
                >
                  <polyline
                    points="9 18 15 12 9 6"
                  />
                </svg>
              </a>
              <div
                class="c2 c3 c4"
              />
            </nav>
            <div
              class="css-view-175oi2r"
              style="display: flex; flex-basis: auto; box-sizing: border-box; position: relative; min-height: 0px; min-width: 0px; flex-shrink: 0; flex-direction: row; justify-content: space-between; align-items: center; gap: 20px; padding-top: 8px; margin-bottom: 20px; z-index: 1;"
            >
              <div
                class="_flexDirection-_md_column _alignItems-_md_flex-start _display-flex _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _flexShrink-0 _flexDirection-row _gap-1316331261 _alignItems-center _pt-1481558307 _minWidth-32px"
              >
                <div
                  class="c2 c3 c5"
                />
                <div
                  class="c2 c3 c6"
                />
              </div>
            </div>
            <div
              class="c7 c8"
              style="position: relative;"
            >
              <svg
                fill="none"
                height="356"
                width="100%"
                xmlns="http://www.w3.org/2000/svg"
              >
                <g>
                  <rect
                    fill="#CECECE40"
                    height="32"
                    rx="4"
                    width="180"
                    y="0"
                  />
                  <rect
                    fill="#CECECE40"
                    height="13"
                    rx="4"
                    width="80"
                    y="48"
                  />
                  <g
                    transform="translate(0, 342)"
                  >
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="7%"
                      x="10%"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="7%"
                      x="28.25%"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="7%"
                      x="46.5%"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="7%"
                      x="64.75%"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="7%"
                      x="83%"
                    />
                  </g>
                  <g
                    transform="translate(0, 10)"
                  >
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="24"
                      x="96%"
                      y="0"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="24"
                      x="96%"
                      y="71.2"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="24"
                      x="96%"
                      y="142.4"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="24"
                      x="96%"
                      y="213.6"
                    />
                    <rect
                      fill="#CECECE40"
                      height="6"
                      rx="3"
                      width="24"
                      x="96%"
                      y="284.8"
                    />
                  </g>
                </g>
                <defs>
                  <lineargradient
                    id="mask-Price-356-gradient"
                    x1="0%"
                    x2="100%"
                    y1="0%"
                    y2="0%"
                  >
                    <stop
                      offset="0"
                      stop-color="#CECECE"
                    >
                      <animate
                        attributeName="offset"
                        dur="1.3s"
                        repeatCount="indefinite"
                        values="-1;3"
                      />
                    </stop>
                    <stop
                      offset="0.5"
                      stop-color="#fff"
                    >
                      <animate
                        attributeName="offset"
                        dur="1.3s"
                        repeatCount="indefinite"
                        values="-0.5;3.5"
                      />
                    </stop>
                    <stop
                      offset="1"
                      stop-color="#CECECE"
                    >
                      <animate
                        attributeName="offset"
                        dur="1.3s"
                        repeatCount="indefinite"
                        values="0;4"
                      />
                    </stop>
                  </lineargradient>
                </defs>
                <mask
                  id="mask-Price-356"
                  style="mask-type: alpha;"
                >
                  <path
                    d="M0 122.5L7.26 116.158L14.52 109.916L21.78 103.873L29.04 98.1233L36.3 92.7582L43.56 87.862L50.82 83.5121L58.08 79.7771L65.34 76.7159L72.6 74.3767L79.86 72.7964L87.12 72H94.38L101.64 72.7964L108.9 74.3767L116.16 76.7159L123.42 79.7771L130.68 83.5121L137.94 87.862L145.2 92.7582L152.46 98.1233L159.72 103.873L166.98 109.916L174.24 116.158L181.5 122.5L188.76 128.842L196.02 135.084L203.28 141.127L210.54 146.877L217.8 152.242L225.06 157.138L232.32 161.488L239.58 165.223L246.84 168.284L254.1 170.623L261.36 172.204L268.62 173H275.88L283.14 172.204L290.4 170.623L297.66 168.284L304.92 165.223L312.18 161.488L319.44 157.138L326.7 152.242L333.96 146.877L341.22 141.127L348.48 135.084L355.74 128.842L363 122.5L370.26 116.158L377.52 109.916L384.78 103.873L392.04 98.1233L399.3 92.7582L406.56 87.862L413.82 83.5121L421.08 79.7771L428.34 76.7159L435.6 74.3767L442.86 72.7964L450.12 72L457.38 72L464.64 72.7964L471.9 74.3767L479.16 76.7159L486.42 79.7771L493.68 83.5121L500.94 87.862L508.2 92.7582L515.46 98.1233L522.72 103.873L529.98 109.916L537.24 116.158L544.5 122.5L551.76 128.842L559.02 135.084L566.28 141.127L573.54 146.877L580.8 152.242L588.06 157.138L595.32 161.488L602.58 165.223L609.84 168.284L617.1 170.623L624.36 172.204L631.62 173H638.88L646.14 172.204L653.4 170.623L660.66 168.284L667.92 165.223L675.18 161.488L682.44 157.138L689.7 152.242L696.96 146.877L704.22 141.127L711.48 135.084L718.74 128.842L726 122.5"
                    stroke="white"
                    stroke-linecap="round"
                    stroke-width="4"
                    transform="translate(5, 75)"
                  />
                </mask>
                <g
                  mask="url(#mask-Price-356)"
                >
                  <rect
                    fill="url(#mask-Price-356-gradient)"
                    height="356"
                    rx="4"
                    width="94%"
                  />
                </g>
              </svg>
            </div>
            <div
              class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _height-4px"
            />
            <div
              class="c9"
            >
              <div
                class="c2 c3 c10 c11"
              />
              <div
                class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _flexWrap-wrap _width-10037"
              >
                <div
                  class="c12"
                >
                  <div
                    class="c13"
                  >
                    <div
                      class="c2 c3 c14"
                    />
                    <div
                      class="c2 c3 c10 c15"
                    />
                  </div>
                  <div
                    class="c13"
                  >
                    <div
                      class="c2 c3 c14"
                    />
                    <div
                      class="c2 c3 c10 c15"
                    />
                  </div>
                </div>
                <div
                  class="c12"
                >
                  <div
                    class="c13"
                  >
                    <div
                      class="c2 c3 c14"
                    />
                    <div
                      class="c2 c3 c10 c15"
                    />
                  </div>
                  <div
                    class="c13"
                  >
                    <div
                      class="c2 c3 c14"
                    />
                    <div
                      class="c2 c3 c10 c15"
                    />
                  </div>
                </div>
              </div>
            </div>
            <hr
              class="c16"
            />
            <div
              class="c17"
            >
              <div
                class="c18 c19 css-1a9hfw6"
              >
                <div
                  class="c2 c3 c10 c11"
                />
              </div>
            </div>
            <div
              class="c2 c3 c20"
            />
            <div
              class="c2 c3 c20"
            />
            <div
              class="c2 c3 c20 c21"
              style="margin-bottom: 24px;"
            />
            <div
              class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _pt-1316330145"
            >
              <div
                class="c2 c3 c20 c22"
              />
              <div
                class="c2 c3 c20 c21"
              />
            </div>
            <div
              class="_display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _pt-1316330145"
            >
              <div
                class="c2 c3 c20 c22"
              />
              <div
                class="c2 c3 c20 c21"
              />
            </div>
          </div>
          <div
            class="_width-_xl_10037 _maxWidth-_xl_780px _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _pt-53px _gap-40px _width-360px"
          >
            <div
              class="c23"
            >
              <div
                class="c24"
              >
                <div
                  class="c18 css-n8z49y"
                >
                  Swap
                </div>
              </div>
              <div
                class="c25"
              >
                <div
                  class="c26"
                >
                  <div
                    class="c27 c28"
                    width="60"
                  />
                  <div
                    class="c29 c28"
                    radius="16"
                    width="100"
                  />
                </div>
              </div>
              <div
                class="c30"
              >
                <div
                  class="c31 c32"
                >
                  <div
                    class="c33"
                  >
                    <svg
                      fill="none"
                      height="16"
                      stroke="#CECECE"
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      stroke-width="2"
                      viewBox="0 0 24 24"
                      width="16"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <line
                        x1="12"
                        x2="12"
                        y1="5"
                        y2="19"
                      />
                      <polyline
                        points="19 12 12 19 5 12"
                      />
                    </svg>
                  </div>
                </div>
                <div
                  class="c25"
                >
                  <div
                    class="c26"
                  >
                    <div
                      class="c27 c28"
                      width="60"
                    />
                    <div
                      class="c29 c28"
                      radius="16"
                      width="100"
                    />
                  </div>
                </div>
              </div>
              <div
                class="c34"
                radius="16"
              />
            </div>
          </div>
        </div>
      </span>
    </span>
  </span>
</DocumentFragment>
`;

exports[`getLoadingTitle should return correct title 1`] = `
<DocumentFragment>
  <span
    class=""
    style="display: contents;"
  >
    <span
      class=" _dsp_contents"
    >
      <span
        class=" t_light _dsp_contents is_Theme"
      >
        token data for 
        <a
          class="is_Anchor font_body _textDecoration-_platformweb_none _transitionDuration-_platformweb_0d0t2s46 _opacity-0hover-0d0t846 _opacity-0active-0d0t646 _display-inline _boxSizing-border-box _wordWrap-break-word _whiteSpace-pre-wrap _mt-0px _mr-0px _mb-0px _ml-0px _color-843135036 _fontFamily-299667014 _fontWeight-500 _fontSize-12px _lineHeight-16px _cursor-pointer is_Anchor font_body "
          data-disable-theme="true"
          href="https://etherscan.io/token/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48"
          rel="noopener noreferrer"
          role="link"
          target="_blank"
        >
          USD//C (USDC)
        </a>
         on Ethereum
      </span>
    </span>
  </span>
</DocumentFragment>
`;
