Elgato_dark/angular
1
0
Fork 0
mirror of https://github.com/angular/angular synced 2026-05-24 09:28:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

docs(devtools): add firefox extension references (#45985)

Browse source 
add a link to recent deployed firefox extension and use less specific terminology
PR Close #45985
This commit is contained in:
4javier 2022-05-13 12:48:42 +02:00 committed by Jessica Janiuk
parent db841d02c9
commit 4070049d8a
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
aio/content/guide/devtools.md
View file

@ -9,9 +9,9 @@ Angular DevTools supports Angular v12 and later.
</div>
You can find Angular DevTools in the [Chrome Web Store](https://chrome.google.com/webstore/detail/angular-developer-tools/ienfalfjdbdpebioblfackkekamfmbnh).
You can find Angular DevTools in the [Chrome Web Store](https://chrome.google.com/webstore/detail/angular-developer-tools/ienfalfjdbdpebioblfackkekamfmbnh) and in [Firefox Addons](https://addons.mozilla.org/en-GB/firefox/addon/angular-devtools/).
After installing Angular DevTools, find the extension under the Angular tab in Chrome DevTools.
After installing Angular DevTools, find the extension under the Angular tab in your browser DevTools.
<div class="lightbox">
@ -92,7 +92,7 @@ To navigate to the previous search match, press `Shift + Enter`.
### Navigate to the host node
To go to the host element of a particular component or directive, find it in the component explorer and double-click it.
Chrome DevTools opens the Elements tab and selects the associated DOM node.
Browsers' DevTools opens the Elements tab in Chrome or the Inspector one in Firefox, and selects the associated DOM node.
### Navigate to source
@ -107,7 +107,7 @@ After you select a particular component, click the icon at the top-right of the
### Update property value
Like Chrome DevTools, the properties view lets you edit the value of an input, output, or another property.
Like browsers' DevTools, the properties view lets you edit the value of an input, output, or another property.
Right-click on the property value.
If edit functionality is available for this value type, you'll see a text input.
Type the new value and press `Enter`.
@ -131,9 +131,9 @@ Type `$ng0` to get a reference to the instance of the currently selected compone
### Select a directive or component
Similar to Chrome DevTools, you can inspect the page to select a particular component or directive.
Click the ***Inspect element*** icon at the top left corner within Devtools and hover over a DOM element on the page.
Angular DevTools recognizes the associated directives and/or components and lets you select the corresponding element in the Component tree.
Similar to browsers' DevTools, you can inspect the page to select a particular component or directive.
Click the ***Inspect element*** icon at the top left corner within Angular DevTools and hover over a DOM element on the page.
The extension recognizes the associated directives and/or components and lets you select the corresponding element in the Component tree.
<div class="lightbox">