chore (#8): adds maintenance tooling

README.md

@@ -7,6 +7,16 @@ Click this button and it will help you create a new repo, create a new Netlify p
 
 [![Deploy to Netlify Button](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/netlify-templates/angular-quickstart)
 
+## Table of Contents:
+
+- [Setup](#setup)
+- [Deploying](#deploying)
+- [Testing](#testing)
+  - [Included Default Testing](#included-default-testing)
+  - [Removing Renovate](#removing-renovate)
+  - [Removing Cypress](#removing-cypress)
+- [Angular + Netlify Resources](#angular--netlify-resources)
+
 ## Setup
 
 Clone this repo with one of these options:
@@ -33,7 +43,49 @@ There are a few ways to deploy this template:
 - Head to the [Netlify UI](https://app.netlify.com/) to deploy via GitHub or [drag and drop](https://app.netlify.com/drop) the project folder
 - Use the Netlify CLI's create from template command `netlify sites:create-template angular-quickstart` which will create a repo, Netlify project, and deploy it
 
-## Angular 💙 Netlify Resources
+## Testing
+
+### Included Default Testing
+
+We’ve included some tooling that helps us maintain these templates. This template currently uses:
+
+- [Renovate](https://www.mend.io/free-developer-tools/renovate/) - to regularly update our dependencies
+- [Cypress](https://www.cypress.io/) - to run tests against how the template runs in the browser
+- [Cypress Netlify Build Plugin](https://github.com/cypress-io/netlify-plugin-cypress) - to run our tests during our build process
+
+If your team is not interested in this tooling, you can remove them with ease!
+
+### Removing Renovate
+
+In order to keep our project up-to-date with dependencies we use a tool called [Renovate](https://github.com/marketplace/renovate). If you’re not interested in this tooling, delete the `renovate.json` file and commit that onto your main branch.
+
+### Removing Cypress
+
+For our testing, we use [Cypress](https://www.cypress.io/) for end-to-end testing. This makes sure that we can validate that our templates are rendering and displaying as we’d expect. By default, we have Cypress not generate deploy links if our tests don’t pass. If you’d like to keep Cypress and still generate the deploy links, go into your `netlify.toml` and delete the plugin configuration lines:
+
+```diff
+[[plugins]]
+  package = "netlify-plugin-cypress"
+-  [plugins.inputs.postBuild]
+-    enable = true
+-
+-  [plugins.inputs]
+-    enable = false 
+```
+
+If you’d like to remove the `netlify-plugin-cypress` build plugin entirely, you’d need to delete the entire block above instead. And then make sure sure to remove the package from the dependencies using:
+
+```bash
+npm uninstall -D netlify-plugin-cypress
+```
+
+And lastly if you’d like to remove Cypress entirely, delete the entire `cypress` folder and the `cypress.config.ts` file. Then remove the dependency using:
+
+```bash
+npm uninstall cypress
+```
+
+## Angular + Netlify Resources
 
 Here are some resources to help you on your Angular + Netlify coding fun!
 

cypress.config.ts

@@ -0,0 +1,8 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+  e2e: {
+    baseUrl: 'http://localhost:8888',
+    supportFile: false,
+  },
+});

cypress/e2e/basic.cy.ts

@@ -0,0 +1,17 @@
+describe('empty spec', () => {
+  beforeEach(() => {
+    cy.visit('/')
+  })
+
+  it('displays the resources text', () => {
+    cy.get('h2')
+    .contains('Here are some resources to help you on your Angular + Netlify journey');
+  })
+  it('renders the image', () => {
+    cy.get('img')
+    .should('be.visible')
+    .and(($img) => {
+      expect($img[0].naturalWidth).to.be.greaterThan(0);
+    })
+  })
+})

netlify.toml

@@ -5,4 +5,13 @@
 [[redirects]]
   from = "/*"
   to = "/index.html"
-  status = 200
+  status = 200
+
+[[plugins]]
+  package = "netlify-plugin-cypress"
+
+  [plugins.inputs.postBuild]
+    enable = true
+
+  [plugins.inputs]
+    enable = false