A Software Tester’s Guide To Chrome Devtools
Learn how to dig deeper into the Web with the use of Devtools
-
-
- Intermediate
- 9
- 13
489 already enrolled
An Introduction To Chrome DevTools
- Explain what devtools is and what its purpose is
- Explain how DevTools can be useful in testing web applications
Understanding and inspecting page markup
- Describe what the elements panel is and how it interacts with HTML
- Use the inspector tool to select an element
Putting client-side validation to the test
- Describe at a high level the difference between client side and server side validation
- Use the inspector tool to demonstrate how to modify an element in order to bypass client side validation
Testing For Accessibility
- Recall what accessibility testing is
- Find some of the features in DevTools to carry out accessibility testing
Simulating Mobile Devices
- Locate the device toolbar
- Use the device toolbar to simulate sizes in different device views
Understanding And Using The Console Panel
- Locate the console panel
- Understand and use some of the console panel features
Undertaking Basic Website Auditing Using Lighthouse
- Locate the Lighthouse panel
- Describe the types of reports available as part of Lighthouse
- Perform a basic accessibility audit
Generating New Test Ideas
- Recognise the key learnings of this course
- Reflect on how you will apply what we have learnt as part of your testing
Despite its name, DevTools isn’t just a tool for developers. DevTools contains many tools which can help you in your day to day testing of web applications. Whether you want to know how to put client validation to the test, gain a better understanding of how to identify and debug errors or just simply run audits on your web applications, then this course is for you.
Perhaps you’ve heard about DevTools but have never used it? Maybe you’ve used one or two of the tools within a few of the panels but don’t fully understand how some of the tools could help you. Throughout this course I will highlight a handful of useful tools that are available.
Within each lesson we will be using a website designed especially for this course to help demonstrate how to make the most of some of the tools within DevTools. Each video within this course will be followed by a hands on activity and/or a short quiz to ensure students understanding of what’s been taught before moving on to the next lesson.
By the end of this course students will gain a solid understanding of how to use the demonstrated tools within DevTools and how using them can assist in their day to day testing of web applications.
What knowledge or skill set do learners need to have before starting your course?
A basic understanding of HTML, CSS and Javascript in order to use DevTools to inspect code and debug some basic errors. An understanding of or some experience of testing web applications.
Are there any existing courses on the Dojo that they should complete first?
It may be useful to take the ‘Building blocks of the internet’ course before taking this gain a basic understanding of DevTools.
Are there any tools or programmes they are required to use?
Chrome DevTools. Students will be given access to the sweet shop project (URL) to test what they’ve learned and to follow along.
