Skip to content

Commit

Permalink
Merge pull request #2873 from MicrosoftDocs/user/pabrosse/json-viewer…
Browse files Browse the repository at this point in the history
…-note

JSON viewer: removing the experimental flag and adding a note about `window.open`
  • Loading branch information
captainbrosset authored Oct 23, 2023
2 parents a41ce6b + 2e03695 commit 8c1c552
Show file tree
Hide file tree
Showing 3 changed files with 6 additions and 19 deletions.
Binary file not shown.
23 changes: 5 additions & 18 deletions microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,11 @@ author: MSEdgeTeam
ms.author: msedgedevrel
ms.topic: conceptual
ms.prod: microsoft-edge
ms.date: 01/04/2023
ms.date: 10/17/2023
---
# View formatted JSON

Use the **JSON viewer** to automatically format and highlight JSON responses and files in browser tabs.
Use the **JSON viewer** to automatically format and syntax highlight JSON responses and files in browser tabs.

The **JSON viewer** changes the returned JSON data to make it easier to read. Sometimes a web server responds to HTTP requests by returning data encoded as JSON. JSON data can be difficult to read when it's formatted as a single long, concatenated line of text. The same can occur when opening a JSON file from disk.

Expand All @@ -20,23 +20,10 @@ The **JSON viewer** improves readability of JSON data in several ways:
* Objects can be collapsed or expanded.
* The JSON viewer matches your operating system's dark or light theme.

The **JSON viewer** tool is included as an experiment in Microsoft Edge starting with version 110.

#### Supported scenarios

<!-- ====================================================================== -->
## Enable the JSON viewer

By default, the **JSON viewer** isn't enabled. To enable the JSON viewer experiment:

1. Go to `edge://flags`.

1. In the **Search flags** text field, type **JSON viewer**.

1. In the **JSON Viewer** dropdown menu, select **Enabled**.

1. Click the **Restart** button which appears in the lower right:

![The edge://flags page showing the JSON viewer flag](./json-viewer-images/enable-flag.png)
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.


<!-- ====================================================================== -->
Expand Down Expand Up @@ -85,7 +72,7 @@ To view invalid JSON data:

1. Type a URL that returns invalid JSON data in the address bar. For example, use [this sample invalid JSON response](https://microsoftedge.github.io/Demos/json-dummy-data/missing-colon.json). You can find other invalid samples of JSON responses at [MicrosoftEdge / Demos > json-dummy-data](https://microsoftedge.github.io/Demos/json-dummy-data/#invalid-json).

1. Microsoft Edge detects that the file contains invalid JSON data, highlights it, but does not reformats it.
1. Microsoft Edge detects that the file contains invalid JSON data and highlights its syntax, but doesn't reformat it.

1. Open the **Console** tool by pressing **Ctrl+Shift+J** (Windows, Linux) or **Command+Option+J** (macOS).

Expand Down
2 changes: 1 addition & 1 deletion microsoft-edge/toc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -1589,7 +1589,7 @@

- name: View formatted JSON
href: devtools-guide-chromium/json-viewer/json-viewer.md
displayName: JSON viewer
displayName: JSON viewer, view JSON

# =============================================================================
# if top-of-page title is longer, add it to displayName comma-delimited list of lookup keywords
Expand Down

0 comments on commit 8c1c552

Please sign in to comment.