Cross-link Extensions samples articles (#3498)

* x-link

* comment: docs to sync

Author: mikehoffms

microsoft-edge/extensions/developer-guide/devtools-extension.md

@@ -567,6 +567,7 @@ See also:
 <!-- ====================================================================== -->
 ## See also
 
+* [Samples for Microsoft Edge extensions](../samples.md)
 * [Manifest V3](https://developer.chrome.com/docs/extensions/mv3)
 * [Extending DevTools](https://developer.chrome.com/docs/extensions/mv3/devtools/)
 * [CDP API Reference](https://developer.chrome.com/docs/extensions/reference/)

microsoft-edge/extensions/getting-started/picture-inserter-content-script.md

@@ -518,7 +518,8 @@ To develop your own Microsoft Edge extension, you can copy and modify the sample
 
 * [Sample: Picture viewer pop-up webpage](./picture-viewer-popup-webpage.md)
 * [Sideload an extension to install and test it locally](extension-sideloading.md)
+* [Samples for Microsoft Edge extensions](../samples.md)
 
 GitHub:
 * [MicrosoftEdge-Extensions](https://github.com/microsoft/MicrosoftEdge-Extensions) repo.
-   * [/picture-inserter-content-script/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension%20samples/picture-inserter-content-script) - source code of this sample.
+   * [/picture-inserter-content-script/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension-samples/picture-inserter-content-script) - source code of this sample.

microsoft-edge/extensions/getting-started/picture-viewer-popup-webpage.md

@@ -330,7 +330,8 @@ After running and testing this extension sample, you can continue on to [Sample:
 
 * [Sideload an extension to install and test it locally](./extension-sideloading.md)
 * [Sample: Picture inserter using content script](./picture-inserter-content-script.md)
+* [Samples for Microsoft Edge extensions](../samples.md)
 
 GitHub:
 * [MicrosoftEdge-Extensions](https://github.com/microsoft/MicrosoftEdge-Extensions) repo.
-   * [/picture-viewer-popup-webpage/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension%20samples/picture-viewer-popup-webpage) - source code of this sample.
+   * [/picture-viewer-popup-webpage/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension-samples/picture-viewer-popup-webpage) - source code of this sample.

microsoft-edge/extensions/samples.md

@@ -6,30 +6,30 @@ ms.author: msedgedevrel
 ms.topic: conceptual
 ms.service: microsoft-edge
 ms.subservice: extensions
-ms.date: 01/27/2023
+ms.date: 07/03/2025
 ---
 # Samples for Microsoft Edge extensions
 
-Use the extensions demos in the [Demos](https://github.com/MicrosoftEdge/Demos#readme) repo to learn how to develop extensions for Microsoft Edge.
+Use the extensions demos to learn how to develop extensions for Microsoft Edge.
 
 
 <!-- ====================================================================== -->
 ## List of samples
-
 <!-- 
-sync'd with table in https://github.com/MicrosoftEdge/Demos#extensions
-
-in https://github.com/MicrosoftEdge/Demos, keep prefix https://learn.microsoft.com
-in https://github.com/MicrosoftDocs/edge-developer repo, remove prefix https://learn.microsoft.com
+sync:
+https://learn.microsoft.com/microsoft-edge/extensions/samples#list-of-samples
+https://github.com/microsoft/MicrosoftEdge-Extensions/blob/main/README.md#code
+https://github.com/MicrosoftEdge/Demos/blob/main/README.md#microsoft-edge-extensions
 -->
 
-| Demo name | Description | Repo directory | Live demo page |
-|:---|:---|:---|:---|
-| Learn to build a Microsoft Edge extension that extends DevTools. | Used for [Create a DevTools extension, adding a custom tool tab and panel](./developer-guide/devtools-extension.md). | [/devtools-extension/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension) | n/a |
-| Basic | A basic DevTools extension. | [/devtools-extension/sample 1/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%201) | n/a |
-| Panel | A basic DevTools extension with a panel. | [/devtools-extension/sample 2/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%202) | n/a |
-| CDP | A basic DevTools extension invoking Chrome Developer Protocol (CDP) APIs. | [/devtools-extension/sample 3/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%203) | n/a |
-| Inspect | A basic DevTools extension that interacts with the Inspected page. | [/devtools-extension/sample 4/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%204) | n/a |
+| Demo name | Description | Repo directory | Docs |
+|---|---|---|---|
+| Picture viewer pop-up webpage | A browser extension, without JavaScript, that displays the `stars.jpeg` image in a small webpage in a pop-up in any Microsoft Edge tab. | [/picture-viewer-popup-webpage/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension-samples/picture-viewer-popup-webpage) in **microsoft / MicrosoftEdge-Extensions** repo | [Sample: Picture viewer pop-up webpage](./getting-started/picture-viewer-popup-webpage.md) |
+| Picture inserter using content script | Uses JavaScript code to insert the `stars.jpeg` image at the top of the current webpage, inside the `<body>` element. | [/picture-inserter-content-script/](https://github.com/microsoft/MicrosoftEdge-Extensions/tree/main/Extension-samples/picture-inserter-content-script) in **microsoft / MicrosoftEdge-Extensions** repo | [Sample: Picture inserter using content script](./getting-started/picture-inserter-content-script.md) |
+| Basic | A basic DevTools extension. | [/devtools-extension/sample 1/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%201) in **MicrosoftEdge / Demos** repo | [Step 1: Create a basic Microsoft Edge extension that has a DevTools webpage](./developer-guide/devtools-extension.md#step-1-create-a-basic-microsoft-edge-extension-that-has-a-devtools-webpage) in _Create a DevTools extension, adding a custom tool tab and panel_. |
+| Panel | A basic DevTools extension with a panel. | [/devtools-extension/sample 2/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%202) in **MicrosoftEdge / Demos** repo | [Step 2: Add a custom tool in DevTools](./developer-guide/devtools-extension.md#step-2-add-a-custom-tool-in-devtools) in _Create a DevTools extension, adding a custom tool tab and panel_. |
+| CDP | A basic DevTools extension invoking Chrome Developer Protocol (CDP) APIs. | [/devtools-extension/sample 3/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%203) in **MicrosoftEdge / Demos** repo | [Step 3: Display memory information by calling extension APIs](./developer-guide/devtools-extension.md#step-3-display-memory-information-by-calling-extension-apis) in _Create a DevTools extension, adding a custom tool tab and panel_. |
+| Inspect | A basic DevTools extension that interacts with the Inspected page. | [/devtools-extension/sample 4/](https://github.com/MicrosoftEdge/Demos/tree/main/devtools-extension/sample%204) in **MicrosoftEdge / Demos** repo | [Step 4: Interact between the webpage and DevTools](./developer-guide/devtools-extension.md#step-4-interact-between-the-webpage-and-devtools) in _Create a DevTools extension, adding a custom tool tab and panel_. |
 
 
 <!-- ====================================================================== -->