Testing for Accessibility on OS X
Now, any console output that your mobile page generates will be streamed to the console open in your desktop web browser, including any errors! It is certainly no replacement for a full web inspector, but it can get you out of trouble when you don’t have access to a Mac.
Afari Developer was designed to fill the gap between Safari‘s Web Inspector and the needs of today‘s web developers. While Web Inspector offers a great variety of tools it lacks support for daily tasks of modern web development. Compatible with Android, iOS (iPhone and iPad), Windows and MAC OS. What is KidInspector? KidInspector is a leading parental control software for computers, smartphones, and tablets that allows parents to monitor messages, calls, WhatsApp, Facebook activity and more. Download Web Inspector Mac Software. Open Validator for Mac v.2.5.2 Open Validator is a handy application designed to help you verify and correct many aspects of conformance of Web pages to International Standard ISO/IEC (E) IEEE Std. Real Device Method: To use web inspector in tandem with a real iDevice, you’ll need the following: An iDevice (iPhone, iPad, iTouch) running iOS 6; USB Cable; Safari 6; Mac OSX Lion (10.7.4) or higher; Virtual Device Method: To use web inspector in tandem with iOS simulator, you’ll need the following: Safari 6; Mac OSX Lion (10.7.4) or higher.
Whether you’re designing a new app or access-enabling an existing one, you should plan to test the accessibility of your product. Testing for accessibility is a bit different than standard user interface testing, and Apple provides a couple of tools that make the process easier. After you’ve discovered accessibility bugs with VoiceOver, inspect your app with these tools to resolve the problems.
App developers should read this chapter to find out how to exercise the accessibility of their apps.
Using the Accessibility Inspector
Apple provides the Accessibility Inspector testing tool that can be launched by choosing Xcode > Open Developer Tool > Accessibility Inspector in the menu bar or Dock. You can download Xcode from the Mac App Store for free. The Accessibility Inspector presents a utility window that displays the information properties (and values), action methods, and position in the accessibility hierarchy of the object currently under the mouse pointer.
If you’re beginning to access-enable your app for assistive technologies like VoiceOver, try using the Accessibility Inspector to view the accessibility information other apps provide. Although the Accessibility Inspector is not an accessibility client, it uses the same APIs accessibility clients use to get information from the accessibility objects it encounters.
To use the Accessibility Inspector, first make sure that it has permission to control your computer. In Security & Privacy preferences, open the Privacy pane. In the left column, select the Accessibility option. In the right column, make sure the Accessibility Inspector app is checked as shown in Figure 6-1.
Now, launch the Accessibility Inspector and move your mouse over the UI element you want to inspect. If you’re using VoiceOver to navigate, you can move the mouse to the VoiceOver cursor by pressing Control-Option-Command-F5. You can lock the Accessibility Inspector on the item under the mouse to examine its attributes, perform its actions, and access its parent and children (if any), by pressing Command-F7. When you do this, the Accessibility Inspector display pauses, allowing you to move the mouse without changing the object on which the tool is focused. In the main utility window, you can go to the object’s parent, children, or other related objects, such as the containing window or the top-level app (
AXApplication
). You can also perform the actions supported by the accessibility object, allowing you to see how these actions affect the values of various attributes and the app itself. If you click the rectangular button in the bottom-right corner of the Accessibility Inspector panel, you’ll see a light blue overlay over the locked UI element.Figure 6-2 shows the Accessibility preferences icon locked. In this example, the
AXPress
action for the element is selected and can be activated by clicking the Perform Action button. The Accessibility Inspector also includes the ability to navigate the Accessibility tree hierarchy using visible buttons or keyboard commands. While holding the Control and Command keys, use the arrow keys to navigate. The up and down arrows navigate to parents or children, and the left and right arrows navigate to siblings of the current element.
Web Inspector Download
You can use the Accessibility Inspector to modify any properties that are marked as writable, as denoted by a W in parentheses. For example, navigate up to the
AXWindow
attribute, and select its AXPosition
property (see Figure 6-3). Change the values of the X and Y text fields, and click the Set Value button. The window changes its position on the screen. You can also perform certain actions, such as AXPress
and AXShowMenu
, by selecting the action and clicking the Perform Action button. As you access-enable your app, use the Accessibility Inspector to make sure your objects contain the appropriate information. If you find that a specific object is not accessible, you can focus the Accessibility Inspector on that object, examine its information property values, and trigger its action methods to find the problem.
Web Inspector For Mac Catalina
Using Accessibility Verifier
Apple provides the Accessibility Verifier tool that can be launched by choosing Accessibility Inspector > Window > Accessibility Verifier. Accessibility Verifier displays the accessibility hierarchy comprising all currently instantiated objects in the selected app. To use Accessibility Verifier, be sure to enable it in Security & Privacy preferences.
Use Accessibility Verifier to perform any or all of the following tests (select the tests you want to run by clicking the Choose Tests button):
- Parent/Child. This test checks the integrity of the accessibility hierarchy by making sure each parent-child pair forms a closed loop. For example, if a child listed in a parent object’s
accessibilityChildren
property does not refer to that object as its parent, this parent-child pair is invalid. Invalid parent-child pairs can prevent an accessibility client from correctly traversing an app’s accessibility hierarchy. - Window. This test checks that all objects contained in a window contain a reference to that window in their
accessibilityWindow
property. An object contained in a window is not necessarily the child of that window, but it should refer to its containing window as a convenience for accessibility clients. - Missing AXDescription. This test checks the element’s
accessibilityLabel
property. All accessible elements must provide some context-specific, descriptive label. - Role Verification. This test verifies that an accessibility object implements all the properties and methods required for its role.
When you click Verify, Accessibility Verifier runs the tests you selected and displays the results for each. The problems are reported as warnings or errors, depending on their severity (you can filter the results by selecting a severity level in the Report Level pop-up menu).
Eliminating all errors and warnings that Accessibility Verifier displays does not guarantee a perfectly accessible app. Always test your app with various accessibility clients, such as VoiceOver, to make sure there are no problems.
Copyright © 2018 Apple Inc. All rights reserved. Terms of Use | Privacy Policy | Updated: 2015-04-08
Recently, I have been working on improving mobile support in the content produced by our PDF to HTML5 converter. One problem that I have encountered is how to debug iOS Safari, particularly if you are not a Mac user.
If you are a web developer, you are likely very familiar with the tools available to you when debugging a web page or web app in a desktop browser, but how do you debug when developing for a mobile device such as the iPad or iPhone?
The answer is that you debug remotely, using the same tool as you would on desktop, except connected to your mobile device. If you are debugging Safari on iOS this will require Safari version 6 and up. Windows & Linux developers will be disappointed to hear that the latest version of Safari available for Windows is version 5, and it’s not available at all on Linux.
If you don’t own or have access to a Mac this can be very frustrating (though I would not say it’s the most frustrating thing about developing a web app for iOS, there are many). It would be great if Apple offered Virtual Machines with Safari pre-installed for testing, as Microsoft does for Internet Explorer. Fortunately, all is not lost – there are some alternatives available which I will discuss below.
Remote Debugging iOS Safari on OS X:
Firstly, you need to have a device running iOS, such as an iPad or an iPhone that you can connect by USB to a Mac computer with Safari version 6 onwards installed.
Next, you need to enable ‘Web Inspector’ on your iOS device. You can do this by going to Settings > Safari > Advanced, and toggling Web Inspector so that it is enabled.
Then, you need to enable the Develop menu in Safari on your Mac computer if it is not already enabled. You can do this by going to Safari > Preferences > Advanced, and ticking the check box for Show Develop menu in menu bar.
Now, if your iOS device is plugged in to your computer with the web page you wish to debug currently open, you can go to Develop > iOS Device Name in desktop Safari, and click on the page you wish to debug.
You can now view and update the DOM, access the JavaScript console and more.
Remote Debugging iOS Safari on Windows and Linux:
[Update – Jan 2019] Since writing this article, the recommended solution is no longer available. There is however a new tool which allows you to debug iOS Safari using the Chrome Web Developer tools. You can find instructions for setting this up here: RemoteDebug iOS WebKit Adapter. I have tested this tool (in January 2019) and can confirm it is working.
There are very few options available to the web developer using Windows, and even fewer for those using Linux. Apparently, the Telerik Platform AppBuilder includes a Chrome Developer Tools capable of remote debugging pages in Safari. You can find a guide for doing that here. Be aware that this is not a free solution.
In my option, the best solution for debugging Safari on Windows and Linux is to use a really cool web app called JSConsole. JSConsole works by inserting a script tag into your web page that overrides the console behavior. Rather than writing logs and errors to a console you can’t see, instead they will be streamed to a jsconsole session open in your desktop web browser that will be listening to your device.
To start, go to jsconsole.com and run :listen in the prompt. This will give you a unique session ID and a script tag that you insert into your mobile web page.
Web Inspector For Mac
Now, any console output that your mobile page generates will be streamed to the console open in your desktop web browser, including any errors!
It is certainly no replacement for a full web inspector, but it can get you out of trouble when you don’t have access to a Mac.
Web Inspector For Mac Download
If you found this article useful, feel free to try our PDF to HTML5 converter online for free.
Do you need to write or read JPEG in Java?
Web Inspector For Mac Windows 7
We have an easy guide on how to write JPEG in Java using ImageIO and JDeli.You can learn how to read/write most of the image files in ImageIO. However, it gives little control over the process.
JDeli is easy to use and offers complete support, so why not give JDeli a try?
JDeli is easy to use and offers complete support, so why not give JDeli a try?
Safari Web Inspector Windows
Find out: