Reading 19 - morgan-401-advanced-javascript/seattle-javascript-401n14 GitHub Wiki

Read

static rendering - enzyme link

  • Shallow rendering is useful to constrain yourself to testing a component as a unit, and to ensure that your tests aren't indirectly asserting on behavior of child components.

shallow mounting - enzyme link

  • Use enzyme's render function to generate HTML from your React tree, and analyze the resulting HTML structure.
  • render returns a wrapper very similar to the other renderers in enzyme, mount and shallow; however, render uses a third party HTML parsing and traversal library Cheerio. We believe that Cheerio handles parsing and traversing HTML extremely well, and duplicating this functionality ourselves would be a disservice.

full mounting - enzyme link

  • Full DOM rendering is ideal for use cases where you have components that may interact with DOM APIs or need to test components that are wrapped in higher order components.
  • Full DOM rendering requires that a full DOM API be available at the global scope. This means that it must be run in an environment that at least “looks like” a browser environment. If you do not want to run your tests inside of a browser, the recommended approach to using mount is to depend on a library called jsdom which is essentially a headless browser implemented completely in JS.

snapshot testinglink

  • Snapshot tests are a very useful tool whenever you want to make sure your UI does not change unexpectedly.

  • A typical snapshot test case for a mobile app renders a UI component, takes a snapshot, then compares it to a reference snapshot file stored alongside the test. The test will fail if the two snapshots do not match: either the change is unexpected, or the reference snapshot needs to be updated to the new version of the UI component.

deploying react apps to aws cloudfrontlink

Deployment Requirements

  1. Before we start implementing our pipeline, we need to list out the requirements of our pipeline and what we will need it to do.
  2. Git push triggering: Start a build whenever we push new commits to our repository.
  3. npm build: We need a node environment that can run the create-react-app build script to generate the js, html, and css files for our application.
  4. S3: We need a place to actually store and host the files. For AWS we will use the Simple Store Service (S3).
  5. A CDN: Though it is possible to serve files directly from S3, a much more performant solution will be to serve the files from a Content Delivery Network, which in our case will be CloudFront.

ci in react/aws link

Skim

selenium

web driver

nightmare

Bookmark

styleguidist

enzyme

nightmare

AWS