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

exports[`<Onboarding /> BioForm renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content about">
      <h2>About You!</h2>
      <form>
        <label htmlFor="summary">
          Tell the community about yourself! Write a quick bio about what you do, what you're interested in, or anything else!
          <textarea
            name="summary"
            onChange={[Function bound handleChange]}
            maxLength="120"
          >
          </textarea>
        </label>
      </form>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound prevSlide]}
        class="back-button"
        type="button"
      >
        BACK
      </button>
      <button
        onClick={[Function bound onSubmit]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;

exports[`<Onboarding /> CloseSlide renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content">
      <h1>
        You‘re part of the community!
        <span
          role="img"
          aria-label="tada"
        >
           🎉
        </span>
      </h1>
      <h2 style="text-align: center;">What next?</h2>
      <div class="onboarding-what-next">
        <a
          href="/welcome"
          data-no-instant={true}
        >
          Join the Welcome Thread
          <p class="whatnext-emoji">
            <span
              role="img"
              aria-label="tada"
            >
              😊
            </span>
          </p>
        </a>
        <a href="/new">
          Write your first DEV post
          <p class="whatnext-emoji">
            <span
              role="img"
              aria-label="tada"
            >
              ✍️
            </span>
          </p>
        </a>
        <a href="/top/infinity">
          Read all-time top posts
          <p class="whatnext-emoji">
            <span
              role="img"
              aria-label="tada"
            >
              🤓
            </span>
          </p>
        </a>
        <a href="/settings">
          Customize your profile
          <p class="whatnext-emoji">
            <span
              role="img"
              aria-label="tada"
            >
              💅
            </span>
          </p>
        </a>
      </div>
    </div>
  </div>
</main>

`;

exports[`<Onboarding /> EmailTermsConditionsForm renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content checkbox-slide">
      <h2>Some things to check off!</h2>
      <form>
        <label htmlFor="checked_code_of_conduct">
          <input
            type="checkbox"
            name="checked_code_of_conduct"
            id="checked_code_of_conduct"
            checked={false}
            onChange={[Function bound handleChange]}
           />
          You agree to uphold our 
          <a
            href="/code-of-conduct"
            data-no-instant={true}
            onClick={[Function onClick]}
          >
            Code of Conduct
          </a>
        </label>
        <label htmlFor="checked_terms_and_conditions">
          <input
            type="checkbox"
            id="checked_terms_and_conditions"
            name="checked_terms_and_conditions"
            checked={false}
            onChange={[Function bound handleChange]}
           />
          You agree to our 
          <a
            href="/terms"
            data-no-instant={true}
            onClick={[Function onClick]}
          >
            Terms and Conditions
          </a>
        </label>
        <h3>Email Preferences</h3>
        <label htmlFor="email_membership_newsletter">
          <input
            type="checkbox"
            id="email_membership_newsletter"
            name="email_membership_newsletter"
            checked={true}
            onChange={[Function bound handleChange]}
           />
          Do you want to receive our weekly newsletter emails?
        </label>
        <label htmlFor="email_digest_periodic">
          <input
            type="checkbox"
            id="email_digest_periodic"
            name="email_digest_periodic"
            checked={true}
            onChange={[Function bound handleChange]}
           />
          Do you want to receive a periodic digest with some of the top posts from your tags?
        </label>
      </form>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound prevSlide]}
        class="back-button"
        type="button"
      >
        BACK
      </button>
      <button
        onClick={[Function bound onSubmit]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;

exports[`<Onboarding /> FollowTags renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content">
      <h2>Follow tags to customize your feed</h2>
      <div class="scroll">
        <button
          type="button"
          onClick={[Function onClick]}
          style="background-color: #000000; color: #ffffff;"
          class="tag"
        >
          #discuss
          <div class="onboarding-tag-follow-indicator"></div>
        </button>
        <button
          type="button"
          onClick={[Function onClick]}
          style="background-color: #f7df1e; color: #000000;"
          class="tag"
        >
          #javascript
          <div class="onboarding-tag-follow-indicator"></div>
        </button>
        <button
          type="button"
          onClick={[Function onClick]}
          style="background-color: #2a2566; color: #ffffff;"
          class="tag"
        >
          #career
          <div class="onboarding-tag-follow-indicator"></div>
        </button>
      </div>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound prevSlide]}
        class="back-button"
        type="button"
      >
        BACK
      </button>
      <button
        onClick={[Function bound handleComplete]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;

exports[`<Onboarding /> FollowUsers renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content">
      <h2>
        Ok, here are some people we picked for you
      </h2>
      <div class="scroll">
        <div class="select-all-button-wrapper">
          <button
            type="button"
            onClick={[Function onClick]}
          >
            Select All ✅
          </button>
        </div>
        <button
          type="button"
          style="background-color: #c7ffe8;"
          onClick={[Function onClick]}
          class="user"
        >
          <div class="onboarding-user-follow-status">selected</div>
          <img
            src="ben.jpg"
            alt=""
           />
          <span>Ben Halpern</span>
          <p></p>
        </button>
        <button
          type="button"
          style="background-color: #c7ffe8;"
          onClick={[Function onClick]}
          class="user"
        >
          <div class="onboarding-user-follow-status">selected</div>
          <img
            src="clown.jpg"
            alt=""
           />
          <span>Krusty the Clown</span>
          <p></p>
        </button>
        <button
          type="button"
          style="background-color: #c7ffe8;"
          onClick={[Function onClick]}
          class="user"
        >
          <div class="onboarding-user-follow-status">selected</div>
          <img
            src="dev.jpg"
            alt=""
           />
          <span>dev.to staff</span>
          <p></p>
        </button>
      </div>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound prevSlide]}
        class="back-button"
        type="button"
      >
        BACK
      </button>
      <button
        onClick={[Function bound handleComplete]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;

exports[`<Onboarding /> IntroSlide renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content">
      <h1>
        <span>Welcome to the </span>
        <img
          src="/assets/purple-dev-logo.png"
          class="sticker-logo"
          alt="DEV"
         />
        <span>community!</span>
      </h1>
      <div>
        <p>
          DEV is where programmers share ideas and help each other grow.
          <span
            role="img"
            aria-label="Nerd Face"
          >
            🤓
          </span>
        </p>
        <p>
          Ask questions, leave helpful comments, encourage others, and have fun!
          <span
            role="img"
            aria-label="Raising Hands"
          >
            🙌
          </span>
        </p>
        <p>
          A few 
          <strong>quick questions</strong>
           for you before you get started...
        </p>
      </div>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound onSubmit]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;

exports[`<Onboarding /> PersonalInformationForm renders properly 1`] = `
preact-render-spy (1 nodes)
-------
<main class="onboarding-body">
  <div class="onboarding-main">
    <div class="onboarding-content about">
      <h2>About You!</h2>
      <form>
        <label htmlFor="location">
          Where are you located?
          <input
            type="text"
            name="location"
            id="location"
            onChange={[Function bound handleChange]}
            maxLength="60"
           />
        </label>
        <label htmlFor="employment_title">
          What is your title?
          <input
            type="text"
            name="employment_title"
            id="employment_title"
            onChange={[Function bound handleChange]}
            maxLength="60"
           />
        </label>
        <label htmlFor="employer_name">
          Where do you work?
          <input
            type="text"
            name="employer_name"
            id="employer_name"
            onChange={[Function bound handleChange]}
            maxLength="60"
           />
        </label>
      </form>
    </div>
    <nav class="onboarding-navigation">
      <button
        onClick={[Function bound prevSlide]}
        class="back-button"
        type="button"
      >
        BACK
      </button>
      <button
        onClick={[Function bound onSubmit]}
        class="next-button"
        type="button"
      >
        Continue
      </button>
    </nav>
  </div>
</main>

`;
