Testing Spikes
Advanced CSS
How can we use advanced CSS features to create complex custom components?
Questions to consider
- What are “combinator” selectors? Can you provide examples where they’re useful?
- What are pseudo-elements? Can you provide examples where they’re useful?
- How might you create custom-styled checkboxes using both of the above?
Useful resources
- CSS selectors
- A Whole Bunch of Amazing Stuff Pseudo Elements Can Do
- Under-Engineered Custom Radio Buttons and Checkboxen
Advanced DOM
How can we use advanced DOM features to make rendering complex UIs easier.
Questions to consider
- What is a NodeList?
- How is it different from an array?
- What’s the different between “live” and “static” NodeLists?
- What is the
<template>element?- How can we use this to render dynamic UI?
Useful resources
Checking our code
What are all the different ways to make sure our code is correct?
Questions to consider
- What is Prettier? How might it help us write better code?
- What is static analysis? How can a linter help us avoid bugs?
- What are the pros and cons of unit, integration and end-to-end tests?
Useful resources
- How To Format Code with Prettier in Visual Studio Code
- ESLint Getting Started
- Static vs Unit vs Integration vs E2E Testing for Frontend Apps
Testing methodologies
How do different testing methodologies try to improve the way we write tests?
Questions to consider
- What is Test-Driven Development (TDD)? Can it help us write better code?
- What is Behavior-Driven Development (BDD)? How do we translate user requirements into automated tests?
- What is test coverage? Can this tell us about the quality of our tests?