Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

JSON viewer: removing the experimental flag and adding a note about window.open #2873

Merged
merged 5 commits into from
Oct 23, 2023
Merged

JSON viewer: removing the experimental flag and adding a note about window.open #2873

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
b4d3430
Added note about window.open and removed flag
captainbrosset Oct 17, 2023
60e2508
Update microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md
captainbrosset Oct 18, 2023
fb502f9
Update microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md
captainbrosset Oct 18, 2023
ae77b2f
Clarified what highlight means
captainbrosset Oct 18, 2023
2e03695
Adding a displayName for the JSON viewer
captainbrosset Oct 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed ...oft-edge/devtools-guide-chromium/json-viewer/json-viewer-images/enable-flag.png
View file
Open in desktop
Binary file not shown.
23 changes: 5 additions & 18 deletions microsoft-edge/devtools-guide-chromium/json-viewer/json-viewer.md
View file
Open in desktop
captainbrosset marked this conversation as resolved.
Show resolved Hide resolved
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
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1586,7 +1586,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