From 0d072fb874fb02a35e8388b1c994f70e76a41fd2 Mon Sep 17 00:00:00 2001
From: Archit Sharma <74408634+iArchitSharma@users.noreply.github.com>
Date: Fri, 7 Oct 2022 11:55:18 +0000
Subject: [PATCH] Resources added for Chrome dev tools (#2215)
---
.../101-accessibility-testing/100-chrome-devtools.md | 11 ++++++++++-
1 file changed, 10 insertions(+), 1 deletion(-)
diff --git a/content/roadmaps/113-qa/content/104-qa-non-functional-testing/101-accessibility-testing/100-chrome-devtools.md b/content/roadmaps/113-qa/content/104-qa-non-functional-testing/101-accessibility-testing/100-chrome-devtools.md
index dc3e7993e..3b8860f31 100644
--- a/content/roadmaps/113-qa/content/104-qa-non-functional-testing/101-accessibility-testing/100-chrome-devtools.md
+++ b/content/roadmaps/113-qa/content/104-qa-non-functional-testing/101-accessibility-testing/100-chrome-devtools.md
@@ -1 +1,10 @@
-# Chrome devtools
\ No newline at end of file
+# Chrome dev tools
+
+These are a set of tools built into the browser to aid frontend developers diagnose and solve various issues in their applications — such as JavaScript and logical bugs, CSS styling issues or even just making quick temprary alterations to the DOM.
+
+To enter the dev tools, right click and click **Inspect** (or press `ctrl+shift+c`/`cmd+opt+c`) to enter the Elements panel. Here you can debug CSS and HTML issues. If you want to see logged messages or interact with javascript, enter the **Console** tab from the tabs above (or press `ctrl+shift+j`/`cmd+opt+j` to enter it directly). Another very useful feature in the Chrome dev tools is the Lighthouse (for checking perfomance) — more on this later.
+
+NOTE: This isn't a chrome-specific feature, and most browsers (Chromium based or otherwise) will have their own, largely-similar set of devtools.
+
+Official Docs
+Mastering Chrome Dev Tools