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

exports[`checks for invalid password 1`] = `
<form
  autoComplete="off"
  onSubmit={[Function]}
>
  <div
    className="Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
  >
    <p
      className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
    >
      To protect against unauthorized changes to your account,
we require users to create a password.
    </p>
    <div
      className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
    >
      <label
        className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
        htmlFor="password"
      >
        Password
      </label>
      <p
        className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
      >
        Must be at least 8 characters
      </p>
      <div
        className="PasswordField-fullWidth PasswordField-root"
      >
        <div
          className="PasswordField-wrapper"
        >
          <input
            autoCapitalize="off"
            autoComplete="off"
            autoCorrect="off"
            className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
            data-testid="password-field"
            disabled={false}
            id="password"
            name="password"
            onBlur={[Function]}
            onChange={[Function]}
            onFocus={[Function]}
            placeholder="Password"
            spellCheck={false}
            type="password"
            value="x"
          />
          <div
            className="PasswordField-icon"
            onClick={[Function]}
            onKeyUp={[Function]}
            role="button"
            tabIndex={0}
            title="Show password"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-sm"
            >
              visibility
            </i>
          </div>
        </div>
      </div>
      <div
        className="Message-root Message-colorError Message-fullWidth"
      >
        <i
          aria-hidden="true"
          className="Icon-root Icon-sm MessageIcon-root"
        >
          warning
        </i>
        <span>
          Password must contain at least 8 characters.
        </span>
      </div>
    </div>
    <button
      className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
      data-color="primary"
      data-variant="filled"
      disabled={false}
      onBlur={[Function]}
      onFocus={[Function]}
      onMouseOut={[Function]}
      onMouseOver={[Function]}
      onTouchEnd={[Function]}
      type="submit"
    >
      Create Password
    </button>
  </div>
</form>
`;

exports[`renders createPassword view 1`] = `
<div>
  <div
    data-testid="completeAccountBox"
  >
    <div
      className="Box-root Flex-root Flex-flex Flex-justifyCenter"
    >
      <div
        className="CompleteAccountBox-container"
      >
        <div
          className="CompleteAccountBox-header"
        >
          <h1
            className="Box-root Typography-root Typography-heading3 Typography-colorTextLight Typography-alignCenter CompleteAccountBox-heading3"
          >
            Finish Setting Up Your Account
          </h1>
          <h1
            className="Box-root Typography-root Typography-heading1 Typography-colorTextLight Typography-alignCenter"
          >
            <span>
              Create Password
            </span>
          </h1>
        </div>
        <div
          className="CompleteAccountBox-main"
        >
          <form
            autoComplete="off"
            onSubmit={[Function]}
          >
            <div
              className="Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
            >
              <p
                className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
              >
                To protect against unauthorized changes to your account,
we require users to create a password.
              </p>
              <div
                className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
              >
                <label
                  className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
                  htmlFor="password"
                >
                  Password
                </label>
                <p
                  className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
                >
                  Must be at least 8 characters
                </p>
                <div
                  className="PasswordField-fullWidth PasswordField-root"
                >
                  <div
                    className="PasswordField-wrapper"
                  >
                    <input
                      autoCapitalize="off"
                      autoComplete="off"
                      autoCorrect="off"
                      className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
                      data-testid="password-field"
                      disabled={false}
                      id="password"
                      name="password"
                      onBlur={[Function]}
                      onChange={[Function]}
                      onFocus={[Function]}
                      placeholder="Password"
                      spellCheck={false}
                      type="password"
                      value=""
                    />
                    <div
                      className="PasswordField-icon"
                      onClick={[Function]}
                      onKeyUp={[Function]}
                      role="button"
                      tabIndex={0}
                      title="Show password"
                    >
                      <i
                        aria-hidden="true"
                        className="Icon-root Icon-sm"
                      >
                        visibility
                      </i>
                    </div>
                  </div>
                </div>
              </div>
              <button
                className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
                data-color="primary"
                data-variant="filled"
                disabled={false}
                onBlur={[Function]}
                onFocus={[Function]}
                onMouseOut={[Function]}
                onMouseOver={[Function]}
                onTouchEnd={[Function]}
                type="submit"
              >
                Create Password
              </button>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</div>
`;

exports[`shows error when submitting empty form 1`] = `
<form
  autoComplete="off"
  onSubmit={[Function]}
>
  <div
    className="Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
  >
    <p
      className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
    >
      To protect against unauthorized changes to your account,
we require users to create a password.
    </p>
    <div
      className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
    >
      <label
        className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
        htmlFor="password"
      >
        Password
      </label>
      <p
        className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
      >
        Must be at least 8 characters
      </p>
      <div
        className="PasswordField-fullWidth PasswordField-root"
      >
        <div
          className="PasswordField-wrapper"
        >
          <input
            autoCapitalize="off"
            autoComplete="off"
            autoCorrect="off"
            className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
            data-testid="password-field"
            disabled={false}
            id="password"
            name="password"
            onBlur={[Function]}
            onChange={[Function]}
            onFocus={[Function]}
            placeholder="Password"
            spellCheck={false}
            type="password"
            value=""
          />
          <div
            className="PasswordField-icon"
            onClick={[Function]}
            onKeyUp={[Function]}
            role="button"
            tabIndex={0}
            title="Show password"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-sm"
            >
              visibility
            </i>
          </div>
        </div>
      </div>
      <div
        className="Message-root Message-colorError Message-fullWidth"
      >
        <i
          aria-hidden="true"
          className="Icon-root Icon-sm MessageIcon-root"
        >
          warning
        </i>
        <span>
          This field is required.
        </span>
      </div>
    </div>
    <button
      className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
      data-color="primary"
      data-variant="filled"
      disabled={false}
      onBlur={[Function]}
      onFocus={[Function]}
      onMouseOut={[Function]}
      onMouseOver={[Function]}
      onTouchEnd={[Function]}
      type="submit"
    >
      Create Password
    </button>
  </div>
</form>
`;

exports[`shows server error 1`] = `
<form
  autoComplete="off"
  onSubmit={[Function]}
>
  <div
    className="Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
  >
    <p
      className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
    >
      To protect against unauthorized changes to your account,
we require users to create a password.
    </p>
    <div
      className="CallOut-root CallOut-colorError CallOut-fullWidth"
    >
      <div
        className="CallOut-inner"
      >
        server error

GraphQL request (4:3)
3: ) {
4:   setPassword(input: $input) {
     ^
5:     user {

      </div>
    </div>
    <div
      className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
    >
      <label
        className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
        htmlFor="password"
      >
        Password
      </label>
      <p
        className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
      >
        Must be at least 8 characters
      </p>
      <div
        className="PasswordField-fullWidth PasswordField-root"
      >
        <div
          className="PasswordField-wrapper"
        >
          <input
            autoCapitalize="off"
            autoComplete="off"
            autoCorrect="off"
            className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
            data-testid="password-field"
            disabled={false}
            id="password"
            name="password"
            onBlur={[Function]}
            onChange={[Function]}
            onFocus={[Function]}
            placeholder="Password"
            spellCheck={false}
            type="password"
            value="secretpassword"
          />
          <div
            className="PasswordField-icon"
            onClick={[Function]}
            onKeyUp={[Function]}
            role="button"
            tabIndex={0}
            title="Show password"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-sm"
            >
              visibility
            </i>
          </div>
        </div>
      </div>
    </div>
    <button
      className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
      data-color="primary"
      data-variant="filled"
      disabled={false}
      onBlur={[Function]}
      onFocus={[Function]}
      onMouseOut={[Function]}
      onMouseOver={[Function]}
      onTouchEnd={[Function]}
      type="submit"
    >
      Create Password
    </button>
  </div>
</form>
`;

exports[`successfully sets password 1`] = `
<form
  autoComplete="off"
  onSubmit={[Function]}
>
  <div
    className="Box-root HorizontalGutter-root HorizontalGutter-oneAndAHalf"
  >
    <p
      className="Box-root Typography-root Typography-bodyCopy Typography-colorTextPrimary"
    >
      To protect against unauthorized changes to your account,
we require users to create a password.
    </p>
    <div
      className="Box-root HorizontalGutter-root FormField-root HorizontalGutter-half"
    >
      <label
        className="Box-root Typography-root Typography-inputLabel Typography-colorTextPrimary InputLabel-root"
        htmlFor="password"
      >
        Password
      </label>
      <p
        className="Box-root Typography-root Typography-fieldDescription Typography-colorTextSecondary"
      >
        Must be at least 8 characters
      </p>
      <div
        className="PasswordField-fullWidth PasswordField-root"
      >
        <div
          className="PasswordField-wrapper"
        >
          <input
            autoCapitalize="off"
            autoComplete="off"
            autoCorrect="off"
            className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
            data-testid="password-field"
            disabled={false}
            id="password"
            name="password"
            onBlur={[Function]}
            onChange={[Function]}
            onFocus={[Function]}
            placeholder="Password"
            spellCheck={false}
            type="password"
            value="secretpassword"
          />
          <div
            className="PasswordField-icon"
            onClick={[Function]}
            onKeyUp={[Function]}
            role="button"
            tabIndex={0}
            title="Show password"
          >
            <i
              aria-hidden="true"
              className="Icon-root Icon-sm"
            >
              visibility
            </i>
          </div>
        </div>
      </div>
    </div>
    <button
      className="BaseButton-root Button-root Button-sizeLarge Button-colorPrimary Button-variantFilled Button-fullWidth"
      data-color="primary"
      data-variant="filled"
      disabled={false}
      onBlur={[Function]}
      onFocus={[Function]}
      onMouseOut={[Function]}
      onMouseOver={[Function]}
      onTouchEnd={[Function]}
      type="submit"
    >
      Create Password
    </button>
  </div>
</form>
`;
