Skip to content

Commit beb1fb8

Browse files
committed
Sync with Kendo UI Professional
1 parent 828f674 commit beb1fb8

File tree

10 files changed

+341
-27
lines changed

10 files changed

+341
-27
lines changed
Lines changed: 168 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,168 @@
1+
---
2+
title: Fiddler Everywhere Reporter
3+
description: Fiddler Everywhere Reporter is an extension tool of Fiddler Everywhere that aims to capture web traffic on the end user's machine and share the log with a user holding an active license for Fiddler Everywhere.
4+
type: how-to
5+
page_title: Fiddler Everywhere Reporter
6+
slug: fiddler-reporter
7+
tags: capture, web, traffic, fiddler, everywhere, reporter, record, video
8+
res_type: kb
9+
---
10+
11+
## Environment
12+
13+
<table>
14+
<tr>
15+
<td>Supported Browsers:</td>
16+
</tr>
17+
<tr>
18+
<td>Google Chrome</td>
19+
</tr>
20+
<tr>
21+
<td>Microsoft Edge (Chromium)</td>
22+
</tr>
23+
</table>
24+
25+
## Description
26+
27+
**Fiddler Everywhere Reporter** is an extension tool of [Fiddler Everywhere](https://docs.telerik.com/fiddler-everywhere/introduction) that aims to capture web traffic on the end user's machine and share the log with a user holding an active license for Fiddler Everywhere.
28+
29+
The captured logs can be analyzed to learn about error messages, malformed requests, currently loaded web resources (for example, JavaScript, CSS style sheets) and more. This can greatly help in troubleshooting issues related to the UI.
30+
31+
![Fiddler Everywhere Reporter Overview](./images/fiddler-reporter-overview.png)
32+
33+
## Solution
34+
35+
The Fiddler Everywhere Reporter is a free portable tool requiring NO login or licenses and no installation.
36+
37+
The Reporter tool has a 3-step usage flow: **Start Capture**, **Stop Capture** and **Save Capture**.
38+
39+
To reset the flow at any point, use the [Start Over](#start-over) button which will delete all captured requests and enable a new capture process.
40+
41+
### Short Instructions
42+
43+
You can follow the short instructions in this section below, or visit the [Start Capture](#start-capture), [Stop Capture](#stop-capture) and [Save Capture](#save-capture) dedicated sections for more details.
44+
45+
**1.** Start the capture using the default option. This will open a Google Chrome or Microsoft Edge (Chromium) instance.
46+
47+
![Start Capture](./images/fiddler-reporter-start-capture.png)
48+
49+
**2.** Within this browser instance, navigate to the web page in question and interact with the page to replicate the issue.
50+
51+
![Browser Instance](./images/fiddler-reporter-browser-instance.png)
52+
53+
The port number shown in the screenshot above is exemplary.
54+
55+
**3.** When done, click on Stop Capture.
56+
57+
![Stop Capture](./images/fiddler-reporter-stop-capture.png)
58+
59+
**4.** Finally, click on Save Capture then share this with us. At this point you can password protect the captured logs if you wish and share the password along with the logs.
60+
61+
![Save Capture](./images/fiddler-reporter-save-capture.png)
62+
63+
![Password Protect the Logs](./images/fiddler-reporter-password-protect.png)
64+
65+
Detailed sections:
66+
67+
1. [Start Capture](#start-capture)
68+
2. [Stop Capture](#stop-capture)
69+
3. [Save Capture](#save-capture)
70+
4. [Notes](#notes)
71+
72+
### Start Capture
73+
74+
There are 4 ways for capturing traffic that can be triggered from the button or the dropdown options:
75+
76+
- [Start Capturing Browser (Default action)](#start-capturing-browser-default-action)
77+
- [Start Capturing Everything](#start-capturing-everything)
78+
- [Start Capturing Terminal](#start-capturing-terminal)
79+
- [Manual Setup (Advanced)](#manual-setup-advanced)
80+
81+
**Start Capturing Browser (Default action)**
82+
83+
The Capture Browser option allows capturing of traffic from a `sandboxed` browser instance. As a result, Fiddler Everywhere Reporter starts a pre-configured independent browser instance to respect the Fiddler proxy and to trust its Root Certificate Authority (CA). The `HTTPS` traffic generated will appear in Fiddler Everywhere Reporter.
84+
85+
Currently, the tool supports independent browser capturing only for **Chrome** and **Edge** browsers. If both exist on the machine, Chrome will be opened by default. A change to the default browser is possible from Tools > Default Browser. Restart the application for the changes to take effect.
86+
87+
If neither Chrome and Edge aren’t installed on the machine, the tool will display an error message.
88+
89+
>important Users on Mac need to manually quit the browser instance from the dock even after the Fiddler Everywhere reporter tool is closed.
90+
91+
This option is available (enabled) if:
92+
- There aren't active capturing processes.
93+
- There aren't any captured requests.
94+
95+
**Start Capturing Everything**
96+
97+
The Capture Everything option will log all HTTP, HTTPS, WebSocket, SSE, and gRPC traffic between the computer and the Internet. It works by setting the system proxy and will capture all incoming and outgoing traffic from any application that supports a proxy - browsers, desktop applications, CLI tools, and others. This option requires installing and trusting the Fiddler Root Certificate Authority (CA) in the operating system.
98+
99+
Upon first trigger of this capturing mode, a dialog will prompt the user to install and trust the Fiddler CA, to configure the option and enable capturing of HTTPS traffic. After providing credentials, traffic will start generating in Fiddler Everywhere Reporter. Closing the Reporter will not clean up the certificate configuration, and the next time you open the tool the settings will be persisted. You can reset this option from the Tools menu -> Remove Root Certificate. A status message about the certificate's current state will always be displayed in the upper right corner.
100+
101+
>important If using a VPN, the Fiddler Everywhere Reporter will not be able to capture any traffic. Try using one of the other approaches for capturing traffic.
102+
103+
This option is available (enabled) if:
104+
- There are no currently active capturing processes.
105+
- There are not any captured requests.
106+
107+
**Start Capturing Terminal**
108+
109+
The Capture Terminal option will launch a new, clean terminal instance, and route traffic only from this instance through Fiddler Everywhere Reporter. It will open PowerShell on Windows and the default Terminal on Mac. The option currently supports capturing traffic from cURL, Node.js and Python out of the box. If you need to capture traffic from .NET applications, it is required to manually install and trust the Fiddler Root Certificate Authority (you can find these options in the Tools menu). The terminal capturing mode allows using the proxy in a sandboxed environment without changing the global OS proxy settings.
110+
111+
>important Users on Mac need to manually quit the terminal instance from the dock even after the Fiddler Everywhere Reporter tool is closed.
112+
113+
This option is available (enabled) if:
114+
- There are no currently active capturing processes.
115+
- There are not any captured requests.
116+
117+
**Manual Setup (Advanced)**
118+
119+
When this mode is selected, Fiddler Everywhere Reporter will start listening on the port printed next to the “Details” label. The address can be copied and used to specify the proxy registry setting of your application and manually configure it to send incoming and outgoing traffic to Fiddler Everywhere Reporter. In addition, the Fiddler Root Certificate needs to be trusted from the Tools menu or manually exported and trusted.
120+
121+
This option is available (enabled) if:
122+
- There are no currently active capturing processes.
123+
- There are not any captured requests.
124+
125+
### Stop Capture
126+
127+
After reproducing the problem, the capturing can be terminated with the Stop Capture button on Step 2.
128+
This will close the open port, remove the system proxy (if set) and stop capturing new requests.
129+
130+
This option is available (enabled) if:
131+
- If there is an active capturing process.
132+
133+
### Save Capture
134+
135+
To save the generated requests, use the button on Step 3 - Save Capture. The button will open a save dialog, where users can enter file name and path.
136+
A password encryption is required in order to save the file successfully. The end-user must provide the password to the team that will be reviewing the file later, to ensure it can be opened and analyzed successfully with Fiddler Everywhere.
137+
Password must be at least 8 symbols.
138+
139+
This option is available (enabled) if:
140+
- There are no currently active capturing processes.
141+
- There is at least one captured session.
142+
143+
### Start Over
144+
145+
To restart the capture, use the Start Over button which will delete all captured requests and enable a new capture process.
146+
147+
This will stop the active capturing process and clear the captured requests.
148+
149+
This option is available (enabled) if:
150+
- There is at least one captured session.
151+
152+
### Details (Advanced)
153+
154+
Details toggle button shows a grid with currently captured requests. In the grid, users can select one or more requests and delete them.
155+
156+
## Notes
157+
158+
- In the Tools menu find additional options to manually Trust Root Certificate, Export Root Certificate and Remove Root Certificate.
159+
- When there is no capturing happening, the UI will display a "Not Capturing" indication.
160+
- While capturing is taking place, the label will change to "Capturing."
161+
- To see the list with all captured requests, the end-user can switch on the "Details" toggle.
162+
- To remove one or more of the captured requests before save, select the respective requests and right-click to remove.
163+
- To check the current version, go to
164+
- File -> About (Windows)
165+
- Fiddler Everywhere Reporter -> About Fiddler Everywhere Reporter (Mac)
166+
- To turn off anonymous analytics tracking, go to
167+
- File -> Privacy -> Automatically send data to help us improve the product (Windows)
168+
- Fiddler Everywhere Reporter -> Privacy -> Automatically send data to help us improve the product
Loading
Loading
Loading
Loading
Loading
Loading
Lines changed: 57 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: Overview
3-
page_title: jQuery Upload Documentation - Upload Accessibility
3+
page_title: jQuery Upload Documentation | Upload Accessibility
44
description: "Get started with the jQuery Upload by Kendo UI and learn about its accessibility support for WAI-ARIA, Section 508, and WCAG 2.2."
55
slug: accessibility_upload
66
position: 1
@@ -10,25 +10,71 @@ position: 1
1010

1111
The Upload is accessible by screen readers and provides WAI-ARIA, Section 508, WCAG 2.2, and keyboard support.
1212

13-
For more information, refer to:
14-
* [Keyboard navigation by the Kendo UI Upload]()
13+
For more information, refer to:
14+
* [Keyboard navigation by the Kendo UI Upload]({% slug keynav_upload %})
1515
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})
1616

17+
18+
19+
20+
Out of the box, the Kendo UI for jQuery Upload provides extensive accessibility support and enables users with disabilities to acquire complete control over its features.
21+
22+
23+
The Upload is compliant with the [Web Content Accessibility Guidelines (WCAG) 2.2 AAA](https://www.w3.org/TR/WCAG22/) standards](https://www.w3.org/TR/WCAG22/) and [Section 508](http://www.section508.gov/) requirements, follows the [Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA)](https://www.w3.org/WAI/ARIA/apg/) best practices for implementing the [keyboard navigation](#keyboard-navigation) for its `component` role, provides options for managing its focus and is tested against the most popular screen readers.
24+
1725
## WAI-ARIA
1826

19-
The component follows the WAI-ARIA Authoring Practices for implementing the keyboard navigation for its component role and is tested against the popular screen readers. For more information, refer to the article on [WAI-ARIA support in Kendo UI for jQuery]({% slug wai_aria_accessibility_support %}).
27+
28+
This section lists the selectors, attributes, and behavior patterns supported by the component and its composite elements, if any.
29+
30+
| Selector | Attribute | Usage |
31+
| -------- | --------- | ----- |
32+
| `.k-upload` | `role=application` | Indicates that the role of the upload is `application`. The component implements single tab stop navigation strategy. Thus, the role is required to support arrow navigation. |
33+
| `.k-upload .k-upload-button` | `tabindex=0` | Assures that the button element inside the upload is the focusable element. |
34+
| | `aria-disabled=true/false` | Announces the disabled state of the upload button. |
35+
| `.k-upload input` | `tabindex=-1` | Assures that the input element inside the upload is not focusable element. |
36+
| | `aria-hidden=true` | The input needs to be hidden from the readers. |
37+
| `.k-upload .k-file .k-file-validation-message` | `aria-live=polite` | Announces the change in the upload status of the file. |
38+
| `.k-upload .k-upload-actions .k-upload-action` | `aria-hidden=true.` | The list file action buttons must be hidden from the readers. |
39+
| | `tabindex=-1` | Assures that the list file action buttons are not focusable elements. |
40+
| `.k-upload .k-actions .k-button` | `role=button` or `nodeName=button` | Announces the purpose of the action button. |
41+
| | `tabindex=0` | The action buttons are focusable through arrow navigation and tabbing through them. |
42+
43+
## Resources
44+
45+
[WAI-ARIA Practices](https://www.w3.org/WAI/ARIA/apg/)
2046

2147
## Section 508
2248

23-
The Upload is compliant with the Section 508 requirements. For more information, refer to the article on [Section 508 support in Kendo UI for jQuery]({% slug section508_accessibility_support %}).
2449

25-
## WCAG 2.2
50+
The Upload is fully compliant with the [Section 508 requirements](http://www.section508.gov/).
2651

27-
The Upload supports the standards for providing accessible web content which are set by the [Web Content Accessibility Guidelines 2.1](https://www.w3.org/TR/WCAG/). For more information, refer to the article on [WCAG 2.2 compliance in Kendo UI for jQuery]({% slug section508_wcag21_accessibility_support %})
52+
## Testing
2853

29-
## See Also
3054

31-
* [Keyboard Navigation by the Upload (Demo)]()
32-
* [Keyboard Navigation by the Upload]()
55+
The Upload has been extensively tested automatically with [axe-core](https://github.com/dequelabs/axe-core) and manually with the most popular screen readers.
56+
57+
> To report any accessibility issues, contact the team through the [Telerik Support System](https://www.telerik.com/account/support-center).
58+
59+
### Screen Readers
60+
61+
62+
The Upload has been tested with the following screen readers and browsers combinations:
63+
64+
| Environment | Tool |
65+
| ----------- | ---- |
66+
| Firefox | NVDA |
67+
| Chrome | JAWS |
68+
| Microsoft Edge | JAWS |
69+
70+
71+
72+
### Automated Testing
73+
The Upload has been tested with [axe-core](https://github.com/dequelabs/axe-core).
74+
### Test Example
75+
A live test example of the Upload component could be found here: https://demos.telerik.com/kendo-ui/accessibility/upload
76+
## See Also
77+
* [Keyboard Navigation by the Upload (Demo)](https://demos.telerik.com/kendo-ui/upload/keyboard-navigation)
78+
* [Keyboard Navigation by the Upload]({% slug keynav_upload %})
3379
* [Keyboard Support in Kendo UI for jQuery]({% slug keyboard_shortcuts_accessibility_support %})
34-
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})
80+
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})
Lines changed: 52 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: Overview
3-
page_title: jQuery Window Documentation - Window Accessibility
3+
page_title: jQuery Window Documentation | Window Accessibility
44
description: "Get started with the jQuery Window by Kendo UI and learn about its accessibility support for WAI-ARIA, Section 508, and WCAG 2.2."
55
slug: accessibility_window
66
position: 1
@@ -10,25 +10,69 @@ position: 1
1010

1111
The Window is accessible by screen readers and provides WAI-ARIA, Section 508, WCAG 2.2, and keyboard support.
1212

13-
For more information, refer to:
13+
For more information, refer to:
1414
* [Keyboard navigation by the Kendo UI Window]({% slug keynav_window %})
1515
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})
1616

17+
18+
19+
20+
Out of the box, the Kendo UI for jQuery Window provides extensive accessibility support and enables users with disabilities to acquire complete control over its features.
21+
22+
23+
The Window is compliant with the [Web Content Accessibility Guidelines (WCAG) 2.2 AA](https://www.w3.org/TR/WCAG22/) standards](https://www.w3.org/TR/WCAG22/) and [Section 508](http://www.section508.gov/) requirements, follows the [Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA)](https://www.w3.org/WAI/ARIA/apg/) best practices for implementing the [keyboard navigation](#keyboard-navigation) for its `component` role, provides options for managing its focus and is tested against the most popular screen readers.
24+
1725
## WAI-ARIA
1826

19-
The component follows the WAI-ARIA Authoring Practices for implementing the keyboard navigation for its component role and is tested against the popular screen readers. For more information, refer to the article on [WAI-ARIA support in Kendo UI for jQuery]({% slug wai_aria_accessibility_support %}).
27+
28+
This section lists the selectors, attributes, and behavior patterns supported by the component and its composite elements, if any.
29+
30+
| Selector | Attribute | Usage |
31+
| -------- | --------- | ----- |
32+
| `.k-window:not(.k-dialog)` | `role=dialog` | Announces the dialog role of the component. |
33+
| | `aria-labelledby=.k-window-title id` | Associate the title of the dialog. |
34+
| `.k-overlay + .k-window` | `aria-modal=true` | Announces that the dialog is modal. Attribute is added only when the dialog is modal. |
35+
36+
37+
Action buttons follow the **Button** specification.
38+
39+
[Button accessibility specification]({{button_a11y_link}})
40+
41+
## Resources
42+
43+
[ARIA practices Modal Dialog Example](https://www.w3.org/WAI/ARIA/apg/example-index/dialog-modal/dialog)
2044

2145
## Section 508
2246

23-
The Window is compliant with the Section 508 requirements. For more information, refer to the article on [Section 508 support in Kendo UI for jQuery]({% slug section508_accessibility_support %}).
2447

25-
## WCAG 2.2
48+
The Window is fully compliant with the [Section 508 requirements](http://www.section508.gov/).
2649

27-
The Window supports the standards for providing accessible web content which are set by the [Web Content Accessibility Guidelines 2.1](https://www.w3.org/TR/WCAG/). For more information, refer to the article on [WCAG 2.2 compliance in Kendo UI for jQuery]({% slug section508_wcag21_accessibility_support %})
50+
## Testing
51+
52+
53+
The Window has been extensively tested automatically with [axe-core](https://github.com/dequelabs/axe-core) and manually with the most popular screen readers.
54+
55+
> To report any accessibility issues, contact the team through the [Telerik Support System](https://www.telerik.com/account/support-center).
56+
57+
### Screen Readers
2858

29-
## See Also
3059

60+
The Window has been tested with the following screen readers and browsers combinations:
61+
62+
| Environment | Tool |
63+
| ----------- | ---- |
64+
| Firefox | NVDA |
65+
| Chrome | JAWS |
66+
| Microsoft Edge | JAWS |
67+
68+
69+
70+
### Automated Testing
71+
The Window has been tested with [axe-core](https://github.com/dequelabs/axe-core).
72+
### Test Example
73+
A live test example of the Window component could be found here: https://demos.telerik.com/kendo-ui/accessibility/window
74+
## See Also
3175
* [Keyboard Navigation by the Window (Demo)](https://demos.telerik.com/kendo-ui/window/keyboard-navigation)
3276
* [Keyboard Navigation by the Window]({% slug keynav_window %})
3377
* [Keyboard Support in Kendo UI for jQuery]({% slug keyboard_shortcuts_accessibility_support %})
34-
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})
78+
* [Accessibility in Kendo UI for jQuery]({% slug overview_accessibility_support_kendoui %})

0 commit comments

Comments
 (0)