The following new features have been added in Safari 4.0.
Redesigned Web Inspector
The Safari Web Inspector has received a face-lift with an easier-to-use, task-based interface. See the Safari Web Inspector Guide for details.
WebKit has some new and changed console methods that improve functionality and compatibility.
The following methods now have two possible forms:
The first, simpler form is as follows:
void method (in Object object1, in Object object2, …)
Each of the
object* parameters is formatted as an object and appended to the output, separated by spaces.
The second form uses a
printf-style format string to format the remaining parameters:
void method (in DOMString formatString, in Object formatParameter1, in Object formatParameter2, …)
formatString parameter specifies the format string, with the remaining (
formatParameter*) parameters substituted in place of the format specifiers within it. The following format specifiers are supported:
Floating-point value with N digits of precision
If more parameters are given than the number of specifiers in the format string, the additional parameters are formatted as objects (
%o) and appended to the output separated by spaces, as in the first form above.
The following new methods have been added:
console.assert (in boolean condition, in Object object1, in Object object2, …)
console.assert (in boolean condition, in DOMString formatString, in Object formatParameter1, in Object formatParameter2, …)
false, all of the
formatParameter*parameters are logged to the Web Inspector console as an error. The parameters are treated as described above under Changed Methods.
console.profile (in DOMString title)
Starts recording a profile titled
console.profileEnd ([in DOMString title])
Stops recording the profile titled
title. If no title is specified, the most recently started profile is stopped.
Gradients, Masks, and Reflections in CSS
WebKit now supports gradients, masks, and reflections specified in CSS:
A gradient is a visual effect you can apply to a surface, which gradually changes the fill color from one value to the next, creating a rainbow effect. Gradients are specified using the
-webkit-gradientfunction and can be passed in place of an image URL parameter.
A mask allows you to block out or obscure an area of an image before rendering it. The
-webkit-maskand related CSS properties are analogous to the
-webkit-border-imageproperties. You can set the mask’s origin, position, and size, and specify how it is used.
A reflection is a mirror image with its own specific transform and mask. Use the
-webkit-box-reflectproperty to set the direction, offset, and mask of an image’s reflection.
See the Safari CSS Visual Effects Guide for more information.
Canvases in CSS
The following new DOM method can then be used to obtain a drawing context for the canvas:
CanvasRenderingContext getCSSCanvasContext (in DOMString contextType, in DOMString identifier, in long width, in long height)
All elements that observe a CSS canvas of the same identifier share the same canvas. This means that you can create animations with drawing changes happening in lockstep for all users of the canvas. See the
-webkit-canvas function in the Safari CSS Reference for more information.
WebKit Availability Macros
WebKit now has availability macros corresponding to specific WebKit releases. These macros let you easily target specific releases of WebKit, much the way you do with OS X releases using the system’s availability macros. Because WebKit releases span multiple versions of OS X, the availability macros are defined in terms of WebKit version numbers rather than OS X system version numbers. There are two defines that you can add to your project to specify the WebKit versions it requires:
WEBKIT_VERSION_MIN_REQUIREDdenotes the earliest WebKit version required for your software to run. By default, it is set to the version of WebKit that originally shipped with the target system version (
WEBKIT_VERSION_MAX_ALLOWEDdenotes the latest WebKit version with which your software can work. By default, it is set to
WEBKIT_VERSION_MIN_REQUIRED, whichever is later.
Accessible Rich Internet Applications
WebKit now has elementary support for the W3C WAI-ARIA specification. One of ARIA’s most compelling features is the ability to assign a role to any element, based on the idea that in modern web applications, a
<div> is not always just a
<div>. The ARIA
role attribute indicates the role that the element plays in the context of the page. See the Safari HTML Reference for a list of roles supported in Safari 4.0. Some roles have corresponding ARIA states to provide additional information required for that role. WebKit has support for the following states:
Here is an example of how to add ARIA role information to a
<div> element containing a visual progress indication:
<div role="progressbar" aria-valuenow="5" aria-valuemin="0" aria-valuemax="10"></div>
WebKit now provides expanded facilities for assistive technology. The ARIA
tabindex attribute enables keyboard navigation on any element, from which assistive technology focus naturally follows. The
tabindex attribute and focus event on every element are introduced in the HTML5 Standard and find new support in WebKit. WebKit also supports the
aria-activedescendant attribute, which provides an additional means of configuring assistive technology focus for any element.
Finally, WebKit supports the attributes
aria-describedby, which allow you to explicitly set accessible names and accessible descriptions, respectively. For more information about building an accessible page using ARIA, see WAI-ARIA 1.0 Authoring Practices.
Cross-Site XML HTTP Requests
WebKit now has basic support for cross-site XML HTTP requests using W3C XMLHttpRequest Level 2 and W3C access control for cross-site requests. This provides a way for servers to specify that a cross-site request is allowed, by sending an
Access-Control HTTP response header. See Using XMLHttpRequest Objects for more information.
HTML5 Cross-Document Messaging
WebKit now supports the HTML5 cross-document messaging standard, allowing documents served from different domains to communicate with each other directly without the need for server relaying. See Cross-Document Messaging for more information.
HTML5 Offline Applications
WebKit now supports the HTML5 offline web applications standard, allowing a web application to dictate which resources it needs, causing WebKit to download them and serve them locally from disk, as well as serve updates to the web application atomically. The Safari 4 Developer Preview does not yet support dynamic or opportunistically cached entries. See HTML5 Offline Application Cache for more information.
HTML5 Local and Session Storage
WebKit now supports the new HTML5 Storage interface, which provides two local key-value stores: a per-window store named
sessionStorage and a per-host store named
localStorage. It also provides event notification so that content in one frame can find out when content in another frame modifies the stored values.
Per-window session storage, accessible from
window.sessionStorage, solves the problem of tracking multiple transactions in multiple windows without the need to work around the limitations of cookies. Local storage, accessible from
window.localStorage, provides the same simple interface but for global, persistent data. Any key-value pair stored in the local storage object persists on the client computer even when the client quits Safari. This provides a simple and persistent way to store user preferences, application settings, and even the user’s data locally on the user’s computer. See Key-Value Storage for more information.