23 - Run Functional Tests using a Headless Browser - Quality Assurance - freeCodeCamp Tutorial

We can use a headless browser like Zombie to check that our apps behave correctly with user interaction. This video shows how to install and set up zombie with an express app, how to run tests, and finally how to complete the freeCodeCamp challenge.

Link to Challenge : https://www.freecodecamp.org/learn/quality-assurance/quality-assurance-and-testing-with-chai/run-functional-tests-using-a-headless-browser Written Guide: https://www.notion.so/ganeshh123/Run-Functional-Tests-using-a-Headless-Browser-d6a6ab1a5c784af8a27d96e06fb936c5

Full Playlist for this course : https://www.youtube.com/playlist?list=PLhGp6N0DI_1SVteCORbgwlxJkAbcTiZyj All Writen Guides for this course : https://www.notion.so/ganeshh123/54ecbf7833414db885eec37f580599b4 All My Tutorials can be found at : https://www.notion.so/Tutorials-Ganesh-H-293ea420d34a464f9a1907e0405b5f26

00:00 - Introduction 00:43 - Express App to Test 01:55 - Install and Set Up Zombie 03:43 - Point the Browser to the app to test - browser.site

04:22 - Visiting a Page - browser.visit() Loads document from the specified URL, processes events and calls the callback, or returns a promise. https://www.npmjs.com/package/zombie#browservisiturl-options-callback

05:44 - Testing if elements exist - browser.assert.element() Asserts that one element matching selection exists. Fails if no element or more than one matching element are found. https://www.npmjs.com/package/zombie#assertelementselection-message

07:36 - Filling in an input - browser.fill() Fill in an input field or text area with the provided value. https://www.npmjs.com/package/zombie#browserfillselector-value-callback

09:11 - Pressing Buttons - browser.pressButton() Press a button (button element or input of type submit). Typically this will submit the form. Use the callback to wait for the from submission, page to load and all events run their course. https://www.npmjs.com/package/zombie#browserpressbuttonselector-callback

10:36 - Testing the text content of elements - browser.assert.text() Asserts that selected element(s) have the expected text content. Fails if no element found that has that text content. https://www.npmjs.com/package/zombie#asserttextselection-expected-message

11:54 - Running the Tests

13:04 - Testing HTTP Status Codes - browser.assert.status(), browser.assert.success() Asserts the current page loaded with the expected status code. https://www.npmjs.com/package/zombie#assertstatuscode-message

14:18 - Other Zombie Methods 14:38 - Challenge Solution

-————————————————————————————————————- Chai is an assertion library, similar to Node's built-in assert. It makes testing much easier by giving you lots of assertions you can run against your code.

freeCodeCamp (al ... https://www.youtube.com/watch?v=9Se9MMFXI7Y