kentcdodds/bookshelf

Error in Setup

mpmccauley opened this issue · 4 comments

Hello!

I'm setting up the bookshelf app and I'm having an issue. I have fully removed and cloned the app a few times with repeatable results. The setup seems to be failing the book-screen.js test. I'm wondering if this is something in my setup or are other people seeing this as well?

Thanks in advance!
-Mike

Here are the details

Commands run so far is:

git clone https://github.com/kentcdodds/bookshelf.git
cd bookshelf
npm run setup --silent

This command gives the following output:

▶️  Starting workshop setup...
      Running the following command: npx "https://gist.github.com/kentcdodds/bb452ffe53a5caa3600197e1d8005733" -q
npx: installed 1 in 1.391s
    ▶️  Starting: System Validation
          Ensuring the correct versions of tools are installed on this computer.
          Running the following command: npx "https://gist.github.com/kentcdodds/abbc32701f78fa70298d444c2303b6d9"
npx: installed 2 in 1.541s
    ✅  Success: System Validation


    ▶️  Starting: Dependency Installation
          Installing third party code dependencies so the workshop works properly on this computer.
          Running the following command: npm install
husky > Setting up git hooks
husky > Done
added 2489 packages from 913 contributors and audited 2502 packages in 28.683s

117 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

    ✅  Success: Dependency Installation


    ▶️  Starting: Project Validation
          Running validation checks to ensure dependencies were installed properly
          Running the following command: npm run validate -s

 RUNS  src/__tests__/book-screen.js
 PASS  src/utils/__tests__/use-async.jsjs
 PASS  src/utils/__tests__/misc.js
 PASS  src/utils/__tests__/api-client.js
 PASS  src/components/__tests__/modal.js
 PASS  src/components/__tests__/rating.js
 FAIL  src/__tests__/book-screen.js (5.005 s)
  ● console errors › note update failures are displayed

    TestingLibraryElementError: Unable to find an element with the role "alert"

    Here are the available roles:

      button:

      Name "Logout":
      <button
        class="css-105y6wg-Button-AuthenticatedApp e1baol0z3"
      />

      Name "Add to list":
      <button
        aria-label="Add to list"
        class="css-bnousp-CircleButton-TooltipButton e1baol0z0"
        data-reach-tooltip-trigger=""
      />

      --------------------------------------------------
      navigation:

      Name "":
      <nav
        class="css-17vy10h-Nav"
      />

      --------------------------------------------------
      list:

      Name "":
      <ul
        class="css-11z6h0h-Nav"
      />

      --------------------------------------------------
      listitem:

      Name "":
      <li />

      Name "":
      <li />

      Name "":
      <li />

      --------------------------------------------------
      link:

      Name "Reading List":
      <a
        class="css-14cbamv-NavLink"
        href="/list"
      />

      Name "Finished Books":
      <a
        class="css-14cbamv-NavLink"
        href="/finished"
      />

      Name "Discover":
      <a
        class="css-14cbamv-NavLink"
        href="/discover"
      />

      --------------------------------------------------
      main:

      Name "":
      <main
        class="css-12ehlsl-AuthenticatedApp"
      />

      --------------------------------------------------
      img:

      Name "dolorem sed doloremque book cover":
      <img
        alt="dolorem sed doloremque book cover"
        class="css-194shf0-BookScreen"
        src="http://placeimg.com/640/480"
      />

      --------------------------------------------------
      heading:

      Name "dolorem sed doloremque":
      <h1 />

      --------------------------------------------------

    <body>
      <div>
        <div
          class="css-1pz3cpr-AuthenticatedApp"
        >
          Tremayne.Mills62
          <button
            class="css-105y6wg-Button-AuthenticatedApp e1baol0z3"
          >
            Logout
          </button>
        </div>
        <div
          class="css-1dchfq2-AuthenticatedApp"
        >
          <div
            class="css-1bxv0zk-AuthenticatedApp"
          >
            <nav
              class="css-17vy10h-Nav"
            >
              <ul
                class="css-11z6h0h-Nav"
              >
                <li>
                  <a
                    class="css-14cbamv-NavLink"
                    href="/list"
                  >
                    Reading List
                  </a>
                </li>
                <li>
                  <a
                    class="css-14cbamv-NavLink"
                    href="/finished"
                  >
                    Finished Books
                  </a>
                </li>
                <li>
                  <a
                    class="css-14cbamv-NavLink"
                    href="/discover"
                  >
                    Discover
                  </a>
                </li>
              </ul>
            </nav>
          </div>
          <main
            class="css-12ehlsl-AuthenticatedApp"
          >
            <div>
              <div
                class="css-fkyky9-BookScreen"
              >
                <img
                  alt="dolorem sed doloremque book cover"
                  class="css-194shf0-BookScreen"
                  src="http://placeimg.com/640/480"
                />
                <div>
                  <div
                    class="css-1tpptxu-BookScreen"
                  >
                    <div
                      class="css-y9z24n-BookScreen"
                    >
                      <h1>
                        dolorem sed doloremque
                      </h1>
                      <div>
                        <i>
                          Ms. Winston Lebsack
                        </i>
                        <span
                          class="css-nn5rmi-BookScreen"
                        >
                          |
                        </span>
                        <i>
                          Mohr Inc
                        </i>
                      </div>
                    </div>
                    <div
                      class="css-1etzife-BookScreen"
                    >
                      <button
                        aria-label="Add to list"
                        class="css-bnousp-CircleButton-TooltipButton e1baol0z0"
                        data-reach-tooltip-trigger=""
                      >
                        <svg
                          fill="currentColor"
                          height="1em"
                          stroke="currentColor"
                          stroke-width="0"
                          viewBox="0 0 512 512"
                          width="1em"
                          xmlns="http://www.w3.org/2000/svg"
                        >
                          <path
                            d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm144 276c0 6.6-5.4 12-12 12h-92v92c0 6.6-5.4 12-12 12h-56c-6.6 0-12-5.4-12-12v-92h-92c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h92v-92c0-6.6 5.4-12 12-12h56c6.6 0 12 5.4 12 12v92h92c6.6 0 12 5.4 12 12v56z"
                          />
                        </svg>
                      </button>
                    </div>
                  </div>
                  <div
                    class="css-n6nwxy-BookScreen"
                  />
                  <br />
                  <p
                    class="css-mptbr-BookScreen"
                  >
                    Odit quisquam voluptatibus esse illum et numquam et nihil. Qui assumenda ut voluptas repellendus eos omnis. Delectus laudantium commodi autem vel voluptatem. Dignissimos est reiciendis provident maxime saepe deserunt ducimus aliquam et. Sit ducimus libero veritatis.
                  </p>
                </div>
              </div>
            </div>
          </main>
        </div>
      </div>
    </body>

      218 |     await waitForLoadingToFinish()
      219 | 
    > 220 |     expect(screen.getByRole('alert').textContent).toMatchInlineSnapshot(
          |                   ^
      221 |       `"There was an error: __test_error_message__"`,
      222 |     )
      223 |   })

      at Object.getElementError (node_modules/@testing-library/dom/dist/config.js:37:19)
      at node_modules/@testing-library/dom/dist/query-helpers.js:90:38
      at node_modules/@testing-library/dom/dist/query-helpers.js:62:17
      at getByRole (node_modules/@testing-library/dom/dist/query-helpers.js:106:19)
      at Object.<anonymous> (src/__tests__/book-screen.js:220:19)

-------------------|---------|----------|---------|---------|-------------------
File               | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
-------------------|---------|----------|---------|---------|-------------------
All files          |    69.5 |    52.67 |   65.41 |   69.62 |                   
 src               |   44.44 |    16.67 |   47.37 |   45.71 |                   
  app.js           |   83.33 |       50 |   66.67 |     100 | 14                
  auth-provider.js |   28.57 |        0 |   28.57 |   28.57 | 14-23,35-46       
  ...icated-app.js |     100 |       50 |     100 |     100 | 98                
  bootstrap.js     |       0 |        0 |       0 |       0 |                   
  index.js         |       0 |      100 |       0 |       0 | 9-10              
  ...icated-app.js |       0 |        0 |       0 |       0 | 12-64             
 src/components    |   66.67 |    47.92 |   69.44 |   65.12 |                   
  book-row.js      |       0 |        0 |       0 |       0 | 12-17             
  lib.js           |   94.44 |       50 |      75 |   94.44 | 144               
  ...-item-list.js |       0 |        0 |       0 |       0 | 10-32             
  logo.js          |       0 |        0 |       0 |       0 | 3-4               
  modal.js         |   94.12 |      100 |   90.91 |   92.86 | 35                
  profiler.js      |       0 |        0 |       0 |       0 | 4-43              
  rating.js        |   88.24 |       50 |   85.71 |    87.5 | 28-29             
  ...us-buttons.js |   85.71 |       75 |   85.71 |   85.71 | 28,72             
 src/context       |   72.34 |    56.25 |   64.29 |   76.19 |                   
  auth-context.js  |      75 |    66.67 |   58.33 |   78.38 | ...55-57,72,79,85 
  index.js         |   57.14 |       25 |     100 |      60 | 12-13             
 src/screens       |   41.38 |    40.48 |   33.33 |   40.74 |                   
  book.js          |     100 |    94.44 |     100 |     100 | 131               
  discover.js      |       0 |        0 |       0 |       0 | 14-94             
  finished.js      |       0 |      100 |       0 |       0 | 6-8               
  not-found.js     |       0 |      100 |       0 |       0 | 7                 
  reading-list.js  |       0 |      100 |       0 |       0 | 6-8               
 src/styles        |     100 |      100 |     100 |     100 |                   
  colors.js        |     100 |      100 |     100 |     100 |                   
  media-queries.js |     100 |      100 |     100 |     100 |                   
 src/utils         |      83 |     87.5 |   79.59 |   83.91 |                   
  api-client.js    |     100 |      100 |     100 |     100 |                   
  books.js         |   43.48 |       50 |   33.33 |   42.11 | 28-45,59-70       
  hooks.js         |     100 |      100 |     100 |     100 |                   
  list-items.js    |   88.57 |    77.78 |   90.91 |   89.29 | 17-19             
  misc.js          |     100 |      100 |     100 |     100 |                   
-------------------|---------|----------|---------|---------|-------------------
Test Suites: 1 failed, 5 passed, 6 total
Tests:       1 failed, 28 passed, 29 total
Snapshots:   3 passed, 3 total
Time:        7.959 s
Ran all test suites.
    🚨  Failure: Project Validation. Please review the messages above for information on how to troubleshoot and resolve this issue.

I can reproduce this. Looking into it now.

I just pushed a temporary fix. It should setup properly for you now. Thanks for your patience.

that was quick! thanks!

And I just got the real fix pushed now, so if you want to get that, then delete the repo and set it up over again.

This was actually something that has been plaguing this project for weeks and I just struck luck this try! Thanks :)