gretacb / mimi Goto Github PK

Research how to add unit tests for React site: https://gatsby.dev/unit-testing

Also, look into solidifying the jest UI snapshot tests. I noticed they will unexpectedly fail on an updated class name, which I dont think should be the case.

> jest

 FAIL  src/components/__tests__/header.js
  Header
    ✕ renders correctly (48ms)

  ● Header › renders correctly

    expect(received).toMatchSnapshot()

    Snapshot name: `Header renders correctly 1`

    - Snapshot
    + Received

    @@ -1,7 +1,7 @@
      <header
    -   className="css-j8g5jg"
    +   className="css-1r8gbns"
      >
        <div
          className="css-1pgpot"
        >
          <h1>

       9 |       .create(<Header siteTitle="Carol Hansen" />)
      10 |       .toJSON()
    > 11 |     expect(tree).toMatchSnapshot()
         |                  ^
      12 |   })
      13 | })

      at Object.toMatchSnapshot (src/components/__tests__/header.js:11:18)

 › 1 snapshot failed.
Snapshot Summary
 › 1 snapshot failed from 1 test suite. Inspect your code changes or run `npm test -- -u` to update them.

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   1 failed, 1 total

• Verify where these class ids come from, and check if these class Ids are "properties" that should be "asymmetrically matched".

Add inspirations page?

• People who have inspired me (writers, engineers, thinkers, etc) and shaped my thoughts on tech
• Quotes
• ...?

Purchase domain name and add to CNAME

I have my badges setup, but need to replace rest of the content.

I ran the site through Lighthouse, its main recommendations:

• properly size images
• Serve images in next-gen formats
• Efficiently encode images

Problem:

• After updating the site, the first site request will result in a blank page. Site contents will show after a hard refresh
• Behaviour seen in Firefox and Chrome

Debugging

• View Source is showing the expected HTML
• The dev console is running InstallingWorker():

When InstallingWorker() finishes, it should print "Content is now available offline!"...but it's not.

• Also interesting is the 404 error:

Uncaught (in promise) Error: 404 page could not be found. 

• After some googling, looks like it could be related to gatsby's offline plugin:
  • gatsbyjs/gatsby#11006
  • https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-offline#notes
  • This is using a Workbox ServiceWorker

Google Analytics is free 🤷‍♀

• https://www.gatsbyjs.org/docs/adding-analytics/
• The analytics.js version of Google Analytics is deprecated. Use gtag.js instead.

Add page for projects/links/etc

You know what to do...