Merge pull request #3189 from MicrosoftDocs/user/mikehoffms/videos

Add video links
MicrosoftDocs · Jun 20, 2024 · 0807ad2 · 0807ad2
2 parents 6c1ed3b + 3cfdccf
commit 0807ad2
Show file tree

Hide file tree

Showing 108 changed files with 925 additions and 123 deletions.
diff --git a/microsoft-edge/dev-videos/index-images/automatic-image-descriptions.png b/microsoft-edge/dev-videos/index-images/automatic-image-descriptions.png
diff --git a/microsoft-edge/dev-videos/index-images/console-errors-copilot.png b/microsoft-edge/dev-videos/index-images/console-errors-copilot.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-106.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-106.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-107.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-107.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-108.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-108.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-109.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-109.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-110.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-110.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-111.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-111.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-112.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-112.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-113-114.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-113-114.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-115-125.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-115-125.png
diff --git a/microsoft-edge/dev-videos/index-images/devtools-whatsnew-93.png b/microsoft-edge/dev-videos/index-images/devtools-whatsnew-93.png
diff --git a/microsoft-edge/dev-videos/index-images/igniting-web-apps-story.png b/microsoft-edge/dev-videos/index-images/igniting-web-apps-story.png
diff --git a/microsoft-edge/dev-videos/index-images/json-viewer.png b/microsoft-edge/dev-videos/index-images/json-viewer.png
diff --git a/microsoft-edge/dev-videos/index-images/latest-developer-tooling.png b/microsoft-edge/dev-videos/index-images/latest-developer-tooling.png
diff --git a/microsoft-edge/dev-videos/index-images/network-tool.png b/microsoft-edge/dev-videos/index-images/network-tool.png
diff --git a/microsoft-edge/dev-videos/index-images/state-of-the-platform.png b/microsoft-edge/dev-videos/index-images/state-of-the-platform.png
diff --git a/microsoft-edge/dev-videos/index-images/the-network-tool-thumbnail.png b/microsoft-edge/dev-videos/index-images/the-network-tool-thumbnail.png
diff --git a/microsoft-edge/dev-videos/index.md b/microsoft-edge/dev-videos/index.md
diff --git a/microsoft-edge/devtools-guide-chromium/3d-view/index-images/3d-view-tool.png b/microsoft-edge/devtools-guide-chromium/3d-view/index-images/3d-view-tool.png
diff --git a/microsoft-edge/devtools-guide-chromium/3d-view/index.md b/microsoft-edge/devtools-guide-chromium/3d-view/index.md
@@ -23,6 +23,12 @@ On the left, the **3D View** tool has 3 tabs:
 On the right, the 3D canvas represents the webpage according to which tab and options you select.
 
 
+<!-- ------------------------------ -->
+#### Video: Debug the web in 3D
+
+[![Thumbnail image for video "Debug the web in 3D"](./index-images/3d-view-tool.png)](https://www.youtube.com/watch?v=LVb1Xzzd72w)
+
+
 <!-- ====================================================================== -->
 ## Open the 3D View tool
 

diff --git a/...t-edge/devtools-guide-chromium/command-menu/index-images/customize-devtools.png b/...t-edge/devtools-guide-chromium/command-menu/index-images/customize-devtools.png
diff --git a/microsoft-edge/devtools-guide-chromium/command-menu/index.md b/microsoft-edge/devtools-guide-chromium/command-menu/index.md
@@ -28,6 +28,12 @@ The Command Menu provides a fast way to navigate the Microsoft Edge DevTools UI
 ![Using the Command Menu to disable JavaScript](./index-images/command-menu-run-command-java.png)
 
 
+<!-- ------------------------------ -->
+#### Video: Customizing Microsoft Edge Developer Tools and quick feature access
+
+[![Thumbnail image for video "Customizing Microsoft Edge Developer Tools and quick feature access"](./index-images/customize-devtools.png)](https://www.youtube.com/watch?v=ypRzEBYNptQ)
+
+
 <!-- ====================================================================== -->
 ## Open the Command Menu
 

diff --git a/...uide-chromium/console/copilot-explain-console-images/console-errors-copilot.png b/...uide-chromium/console/copilot-explain-console-images/console-errors-copilot.png
diff --git a/microsoft-edge/devtools-guide-chromium/console/copilot-explain-console.md b/microsoft-edge/devtools-guide-chromium/console/copilot-explain-console.md
@@ -17,6 +17,12 @@ When inspecting a webpage with DevTools, you often see errors and warnings in th
 ![Copilot in the Microsoft Edge sidebar, showing the error message and the explanation](./copilot-explain-console-images/copilot-error-explanation.png)
 
 
+<!-- ------------------------------ -->
+#### Video: Explain DevTools Console errors using Copilot in Edge
+
+[![Thumbnail image for video "Explain DevTools Console errors using Copilot in Edge"](./copilot-explain-console-images/console-errors-copilot.png)](https://www.youtube.com/watch?v=vfVsAmNFLik)
+
+
 <!-- ------------------------------ -->
 #### Supported scenarios
 

diff --git a/...devtools-guide-chromium/customize/localization-images/devtools-localization.png b/...devtools-guide-chromium/customize/localization-images/devtools-localization.png
diff --git a/microsoft-edge/devtools-guide-chromium/customize/localization.md b/microsoft-edge/devtools-guide-chromium/customize/localization.md
@@ -32,6 +32,12 @@ The DevTools UI in Chinese:
 ![The DevTools UI in Chinese](./localization-images/localization-zh.png)
 
 
+<!-- ------------------------------ -->
+#### Video: Use your preferred language in Microsoft Edge DevTools
+
+[![Thumbnail image for video "Use your preferred language in Microsoft Edge DevTools"](./localization-images/devtools-localization.png)](https://www.youtube.com/watch?v=AeF0AvWpUO8)
+
+
 <!-- ====================================================================== -->
 ## Reverting the DevTools UI to English
 

diff --git a/microsoft-edge/devtools-guide-chromium/experimental-features/index.md b/microsoft-edge/devtools-guide-chromium/experimental-features/index.md
@@ -1016,7 +1016,7 @@ _new as of Microsoft Edge 128_
 
 In the **Performance** tool, when exporting the trace file, stores the source code of compiled scripts in the trace file.
 
-This experiment makes the **Performance** tool record script source text in treaces.  This feature is being implemented in the upstream Chromium project.
+This experiment makes the **Performance** tool record script source text in traces.  This feature is being implemented in the upstream Chromium project.
 
 Status:
 * This checkbox is present in Microsoft Edge Canary 128.

diff --git a/...-edge/devtools-guide-chromium/issues/index-images/advanced-issues-filtering.png b/...-edge/devtools-guide-chromium/issues/index-images/advanced-issues-filtering.png
diff --git a/microsoft-edge/devtools-guide-chromium/issues/index.md b/microsoft-edge/devtools-guide-chromium/issues/index.md
@@ -39,6 +39,12 @@ Feedback in the **Issues** tool is provided by several sources, including the Ch
 *  [webhint](https://webhint.io)
 
 
+<!-- ------------------------------ -->
+#### Video: Advanced issues filtering in Edge DevTools and VSCode
+
+[![Thumbnail image for video "Advanced issues filtering in Edge DevTools and VSCode"](./index-images/advanced-issues-filtering.png)](https://www.youtube.com/watch?v=_dePgo89bq0)
+
+
 <!-- ====================================================================== -->
 ## Opening the Issues tool
 

diff --git a/...oft-edge/devtools-guide-chromium/json-viewer/json-viewer-images/json-viewer.png b/...oft-edge/devtools-guide-chromium/json-viewer/json-viewer-images/json-viewer.png
diff --git a/microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md b/microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md
@@ -22,6 +22,13 @@ The **JSON viewer** improves readability of JSON data in several ways:
 *  The JSON viewer matches your operating system's dark or light theme.
 
 
+<!-- ------------------------------ -->
+#### Video: The JSON viewer
+
+[![Thumbnail image for video "The JSON viewer"](./json-viewer-images/json-viewer.png)](https://www.youtube.com/watch?v=DO7V6lw1SWA)
+
+
+<!-- ------------------------------ -->
 #### Supported scenarios
 
 The **JSON viewer** is not supported in windows that are opened by using the `window.open` JavaScript method. In windows opened with `window.open`, JSON data is displayed as a single line of text, without formatting or syntax highlighting.

diff --git a/.../devtools-guide-chromium/memory-problems/dom-leaks-images/detached-elements.png b/.../devtools-guide-chromium/memory-problems/dom-leaks-images/detached-elements.png
diff --git a/microsoft-edge/devtools-guide-chromium/memory-problems/dom-leaks.md b/microsoft-edge/devtools-guide-chromium/memory-problems/dom-leaks.md
@@ -23,6 +23,12 @@ As explained in [Fix memory problems](index.md), memory issues affect page perfo
 *  The performance of a page is delayed or appears to pause frequently.
 
 
+<!-- ------------------------------ -->
+#### Video: Debug memory leaks with the Microsoft Edge Detached Elements tool
+
+[![Thumbnail image for video "Debug memory leaks with the Microsoft Edge Detached Elements tool"](./dom-leaks-images/detached-elements.png)](https://www.youtube.com/watch?v=v2iy17ptmBk)
+
+
 <!-- ====================================================================== -->
 ## Open the Detached Elements tool
 

diff --git a/microsoft-edge/devtools-guide-chromium/network/index.md b/microsoft-edge/devtools-guide-chromium/network/index.md
@@ -29,12 +29,16 @@ This is a step-by-step tutorial walkthrough of the **Network** tool, for inspect
 
 For an overview of the network-related DevTools features, see [Network features reference](reference.md).
 
+
+<!-- ------------------------------ -->
+#### Video: Learn to Use the Network Tool
+
 For a video version of this tutorial, view the following video:
 
-[![Thumbnail image for the DevTools Network tool video](./index-images/network-tool-intro-video.png)](https://www.youtube.com/watch?v=niG_Ck6E5L8)
+[![Thumbnail image for video "Learn to Use the Network Tool"](./index-images/network-tool-intro-video.png)](https://www.youtube.com/watch?v=niG_Ck6E5L8)
 
-<!-- TODO: entire section needs a Microsoft Edge DevTools rewrite  -->
 
+<!-- TODO: entire section needs a Microsoft Edge DevTools rewrite  -->
 
 <!-- ====================================================================== -->
 ## When to use the Network tool

diff --git a/microsoft-edge/devtools-guide-chromium/overview-images/learn-devtools-ui.png b/microsoft-edge/devtools-guide-chromium/overview-images/learn-devtools-ui.png
diff --git a/microsoft-edge/devtools-guide-chromium/overview.md b/microsoft-edge/devtools-guide-chromium/overview.md
@@ -35,6 +35,16 @@ With DevTools, you can do the following:
 <!-- /keep sync'd -->
 
 
+<!-- ------------------------------ -->
+#### Video: Understand the DevTools user interface
+
+[![Thumbnail image for video "Understand the DevTools user interface"](./overview-images/learn-devtools-ui.png)](https://www.youtube.com/watch?v=ayemJLeE55c)
+
+This slightly older, September 2022 video shows the legacy UI for DevTools:
+* Instead of the **Activity Bar**, the video shows the legacy main toolbar.
+* Instead of the **Quick View** panel (at bottom of DevTools), the video shows the **Drawer**.
+
+
 <!-- ====================================================================== -->
 ## Open DevTools
 <!-- keep sync'd:

diff --git a/...tools-guide-chromium/whats-new/2021/07/devtools-images/devtools-whatsnew-93.png b/...tools-guide-chromium/whats-new/2021/07/devtools-images/devtools-whatsnew-93.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2021/07/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2021/07/devtools.md
@@ -13,6 +13,12 @@ ms.date: 07/30/2021
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 93
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 93"](./devtools-images/devtools-whatsnew-93.png)](https://www.youtube.com/watch?v=rDB_a4bUeeA)
+
+
 <!-- ====================================================================== -->
 ## Apply themes from Visual Studio Code to DevTools
 

diff --git a/...tools-guide-chromium/whats-new/2021/09/devtools-images/devtools-whatsnew-94.png b/...tools-guide-chromium/whats-new/2021/09/devtools-images/devtools-whatsnew-94.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2021/09/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2021/09/devtools.md
@@ -13,6 +13,12 @@ ms.date: 09/03/2021
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 94
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 94"](./devtools-images/devtools-whatsnew-94.png)](https://www.youtube.com/watch?v=S-g1E_W9wQQ)
+
+
 <!-- ====================================================================== -->
 ## Search for Console errors on the web
 

diff --git a/...tools-guide-chromium/whats-new/2021/10/devtools-images/devtools-whatsnew-95.png b/...tools-guide-chromium/whats-new/2021/10/devtools-images/devtools-whatsnew-95.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2021/10/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2021/10/devtools.md
@@ -13,6 +13,12 @@ ms.date: 10/20/2021
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 95
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 95"](./devtools-images/devtools-whatsnew-95.png)](https://www.youtube.com/watch?v=JsnW0CU1l80)
+
+
 <!-- ====================================================================== -->
 ## Sync live changes from the Styles tool in the Visual Studio Code extension
 

diff --git a/...tools-guide-chromium/whats-new/2021/11/devtools-images/devtools-whatsnew-96.png b/...tools-guide-chromium/whats-new/2021/11/devtools-images/devtools-whatsnew-96.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2021/11/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2021/11/devtools.md
@@ -13,6 +13,12 @@ ms.date: 11/16/2021
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 96
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 96"](./devtools-images/devtools-whatsnew-96.png)](https://www.youtube.com/watch?v=H6dYeoGOIDk)
+
+
 <!-- ====================================================================== -->
 ## New DevTools UI available (in preview)
 

diff --git a/...tools-guide-chromium/whats-new/2022/01/devtools-images/devtools-whatsnew-97.png b/...tools-guide-chromium/whats-new/2022/01/devtools-images/devtools-whatsnew-97.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/01/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/01/devtools.md
@@ -13,6 +13,12 @@ ms.date: 01/14/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 97
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 97"](./devtools-images/devtools-whatsnew-97.png)](https://www.youtube.com/watch?v=qbDLtE0a_yQ)
+
+
 <!-- ====================================================================== -->
 ## Introducing the Detached Elements tool
 

diff --git a/...tools-guide-chromium/whats-new/2022/02/devtools-images/devtools-whatsnew-98.png b/...tools-guide-chromium/whats-new/2022/02/devtools-images/devtools-whatsnew-98.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/02/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/02/devtools.md
@@ -13,6 +13,12 @@ ms.date: 02/02/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 98
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 98"](./devtools-images/devtools-whatsnew-98.png)](https://www.youtube.com/watch?v=HpaRDwU_AZI)
+
+
 <!-- ====================================================================== -->
 ## Catch up on the latest and greatest features in Microsoft Edge
 

diff --git a/...-guide-chromium/whats-new/2022/03/devtools-100-images/devtools-whatsnew-100.png b/...-guide-chromium/whats-new/2022/03/devtools-100-images/devtools-whatsnew-100.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/03/devtools-100.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/03/devtools-100.md
@@ -13,6 +13,12 @@ ms.date: 03/31/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 100
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 100"](./devtools-100-images/devtools-whatsnew-100.png)](https://www.youtube.com/watch?v=aP6d2PIU7hc)
+
+
 <!-- ====================================================================== -->
 ## Join the Microsoft Edge DevTools community at GitHub
 

diff --git a/...tools-guide-chromium/whats-new/2022/03/devtools-images/devtools-whatsnew-99.png b/...tools-guide-chromium/whats-new/2022/03/devtools-images/devtools-whatsnew-99.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/03/devtools.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/03/devtools.md
@@ -13,6 +13,12 @@ ms.date: 03/09/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 99
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 99"](./devtools-images/devtools-whatsnew-99.png)](https://www.youtube.com/watch?v=Z5-tEE_cNTo)
+
+
 <!-- ====================================================================== -->
 ## Securely debug your production code with source maps from Azure Artifacts Symbol Server
 

diff --git a/...-guide-chromium/whats-new/2022/04/devtools-101-images/devtools-whatsnew-101.png b/...-guide-chromium/whats-new/2022/04/devtools-101-images/devtools-whatsnew-101.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/04/devtools-101.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/04/devtools-101.md
@@ -13,6 +13,12 @@ ms.date: 04/28/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 101
+
+[![Thumbnail image for video "Microsoft Edge | What's New in DevTools 101"](./devtools-101-images/devtools-whatsnew-101.png)](https://www.youtube.com/watch?v=kv6Q8a9bsbA)
+
+
 <!-- ====================================================================== -->
 ## The Console tool is now available in Visual Studio Code
 

diff --git a/...-guide-chromium/whats-new/2022/05/devtools-102-images/devtools-whatsnew-102.png b/...-guide-chromium/whats-new/2022/05/devtools-102-images/devtools-whatsnew-102.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/05/devtools-102.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/05/devtools-102.md
@@ -18,6 +18,12 @@ ms.date: 05/24/2022
 > * [Microsoft Edge | Build 2022: Enriching desktop experiences with the power and reach of the web](https://www.youtube.com/watch?v=ahO5nePl4BQ)
 
 
+<!-- ------------------------------ -->
+#### Video: Microsoft Edge | What's New in DevTools 102
+
+[![Thumbnail image for video "What's New in DevTools 102"](./devtools-102-images/devtools-whatsnew-102.png)](https://www.youtube.com/watch?v=JY6DfhSdr_A)
+
+
 <!-- ====================================================================== -->
 ## DevTools extension: New browser with device and mode emulation and sourcemap support
 

diff --git a/...-guide-chromium/whats-new/2022/06/devtools-103-images/devtools-whatsnew-103.png b/...-guide-chromium/whats-new/2022/06/devtools-103-images/devtools-whatsnew-103.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/06/devtools-103.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/06/devtools-103.md
@@ -13,6 +13,12 @@ ms.date: 06/23/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 103
+
+[![Thumbnail image for video "What's new in DevTools 103"](./devtools-103-images/devtools-whatsnew-103.png)](https://www.youtube.com/watch?v=aa0C6BRdaPA)
+
+
 <!-- ====================================================================== -->
 ## New node types in the Memory tool
 

diff --git a/...-guide-chromium/whats-new/2022/08/devtools-104-images/devtools-whatsnew-104.png b/...-guide-chromium/whats-new/2022/08/devtools-104-images/devtools-whatsnew-104.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/08/devtools-104.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/08/devtools-104.md
@@ -13,6 +13,12 @@ ms.date: 08/02/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 104
+
+[![Thumbnail image for video "What's new in DevTools 104"](./devtools-104-images/devtools-whatsnew-104.png)](https://www.youtube.com/watch?v=0_ZprFX8x0I)
+
+
 <!-- ====================================================================== -->
 ## Use Layers in 3D View
 

diff --git a/...-guide-chromium/whats-new/2022/09/devtools-105-images/devtools-whatsnew-105.png b/...-guide-chromium/whats-new/2022/09/devtools-105-images/devtools-whatsnew-105.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/09/devtools-105.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/09/devtools-105.md
@@ -13,6 +13,12 @@ ms.date: 09/01/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 105
+
+[![Thumbnail image for video "What's new in DevTools 105"](./devtools-105-images/devtools-whatsnew-105.png)](https://www.youtube.com/watch?v=h0XJH_iLoUk)
+
+
 <!-- ====================================================================== -->
 ## Test your PWA's protocol handlers from the Application tool
 

diff --git a/...-guide-chromium/whats-new/2022/09/devtools-106-images/devtools-whatsnew-106.png b/...-guide-chromium/whats-new/2022/09/devtools-106-images/devtools-whatsnew-106.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/09/devtools-106.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/09/devtools-106.md
@@ -13,6 +13,12 @@ ms.date: 09/29/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 106
+
+[![Thumbnail image for video "What's new in DevTools 106"](./devtools-106-images/devtools-whatsnew-106.png)](https://www.youtube.com/watch?v=LJxjFo4DuA0)
+
+
 <!-- ====================================================================== -->
 ## Introducing the Command Palette
 

diff --git a/...-guide-chromium/whats-new/2022/10/devtools-107-images/devtools-whatsnew-107.png b/...-guide-chromium/whats-new/2022/10/devtools-107-images/devtools-whatsnew-107.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/10/devtools-107.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/10/devtools-107.md
@@ -13,6 +13,12 @@ ms.date: 10/31/2022
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 107
+
+[![Thumbnail image for video "What's new in DevTools 107"](./devtools-107-images/devtools-whatsnew-107.png)](https://www.youtube.com/watch?v=QcAnrbfJN0s)
+
+
 <!-- ====================================================================== -->
 ## Automate WebView2 with Playwright
 

diff --git a/...-guide-chromium/whats-new/2022/12/devtools-108-images/devtools-whatsnew-108.png b/...-guide-chromium/whats-new/2022/12/devtools-108-images/devtools-whatsnew-108.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2022/12/devtools-108.md b/microsoft-edge/devtools-guide-chromium/whats-new/2022/12/devtools-108.md
@@ -12,7 +12,11 @@ ms.date: 12/01/2022
 
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
-<!-- find "todo" in this .md file -->
+
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 108
+
+[![Thumbnail image for video "What's new in DevTools 108"](./devtools-108-images/devtools-whatsnew-108.png)](https://www.youtube.com/watch?v=KmGXnsSCtI4)
 
 
 <!-- ====================================================================== -->

diff --git a/...-guide-chromium/whats-new/2023/01/devtools-109-images/devtools-whatsnew-109.png b/...-guide-chromium/whats-new/2023/01/devtools-109-images/devtools-whatsnew-109.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2023/01/devtools-109.md b/microsoft-edge/devtools-guide-chromium/whats-new/2023/01/devtools-109.md
@@ -13,6 +13,12 @@ ms.date: 01/13/2023
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 109
+
+[![Thumbnail image for video "What's new in DevTools 109"](./devtools-109-images/devtools-whatsnew-109.png)](https://www.youtube.com/watch?v=b-q-PLmO-ns)
+
+
 <!-- ====================================================================== -->
 ## Import and export your DevTools instances with the new enhanced traces feature
 

diff --git a/...-guide-chromium/whats-new/2023/02/devtools-110-images/devtools-whatsnew-110.png b/...-guide-chromium/whats-new/2023/02/devtools-110-images/devtools-whatsnew-110.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2023/02/devtools-110.md b/microsoft-edge/devtools-guide-chromium/whats-new/2023/02/devtools-110.md
@@ -13,6 +13,12 @@ ms.date: 02/09/2023
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 110
+
+[![Thumbnail image for video "What's new in DevTools 110"](./devtools-110-images/devtools-whatsnew-110.png)](https://www.youtube.com/watch?v=qrzq3bN_1BY)
+
+
 <!-- ====================================================================== -->
 ## Taking heap snapshots in the Memory tool is now faster
 

diff --git a/...-guide-chromium/whats-new/2023/03/devtools-111-images/devtools-whatsnew-111.png b/...-guide-chromium/whats-new/2023/03/devtools-111-images/devtools-whatsnew-111.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2023/03/devtools-111.md b/microsoft-edge/devtools-guide-chromium/whats-new/2023/03/devtools-111.md
@@ -13,6 +13,12 @@ ms.date: 03/15/2023
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 111
+
+[![Thumbnail image for video "What's new in DevTools 111"](./devtools-111-images/devtools-whatsnew-111.png)](https://www.youtube.com/watch?v=-0pWQsqlHAg)
+
+
 <!-- ====================================================================== -->
 ## Remote debugging of Microsoft Edge, PWAs, and WebView2 controls on HoloLens 2 devices
 

diff --git a/...-guide-chromium/whats-new/2023/04/devtools-112-images/devtools-whatsnew-112.png b/...-guide-chromium/whats-new/2023/04/devtools-112-images/devtools-whatsnew-112.png
diff --git a/microsoft-edge/devtools-guide-chromium/whats-new/2023/04/devtools-112.md b/microsoft-edge/devtools-guide-chromium/whats-new/2023/04/devtools-112.md
@@ -13,6 +13,12 @@ ms.date: 04/11/2023
 [!INCLUDE [Microsoft Edge team note for top of What's New](../../includes/edge-whats-new-note.md)]
 
 
+<!-- ------------------------------ -->
+#### Video: What's new in DevTools 112
+
+[![Thumbnail image for video "What's new in DevTools 112"](./devtools-112-images/devtools-whatsnew-112.png)](https://www.youtube.com/watch?v=xuICl66F-Ik)
+
+
 <!-- ====================================================================== -->
 ## Performance tool unminifies JavaScript running in out-of-process iframes
 

diff --git a/...de-chromium/whats-new/2023/05/devtools-113-images/devtools-whatsnew-113-114.png b/...de-chromium/whats-new/2023/05/devtools-113-images/devtools-whatsnew-113-114.png