Canvas Line Dashing, MathML meets Flexbox and WebKit’s Cowhands

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 24

Sorry for the recent lack of updates, I’ve been really busy. This update discusses everything until the 24th of September, so two weeks, not including last week. Early next week I’ll publish an article covering last and this week, to get you fully up to date again.

In Web Inspector’s Style panel, the relevant selector that causes a rule to be applied to a certain element will now be highlighted. The XMLHttpRequest Replay feature has been added to the Network Panel, search and filtering features are now available in the Timeline panel and all named flows can now be displayed in the CSS Named Flows drawer.

The Flexbox implementation in WebKit now supports absolutely positioned flex items, and had two bugs fixed. Initial work for supporting exclusions for basic shapes has landed, and more work on CSS Exclusions’ shape-inside function has been done as well. Finally, the mask-type attribute on SVG’s <mask> element is now supported too.

Support for drawing dashed lines in the 2D Canvas APIs according to the specification landed, and introduced the getLineDash and setLineDash methods, and the lineDashOffset attribute. The prefixed version of Blob.slice() has been removed, and Chromium has removed support for the prefixed postMessage method. SVG’s appendItem method on path segment list has been sped up from linear to constant time. Support for creating a Shadow Root on replaced elements has been removed for now and CSS Region’s getRegionFlowRanges method on Elements has been implemented.

David Barton updated all of MathML’s rendering to be based on the Flexible Box module, simplifying the code significantly. Over the past number of months, he’s done quite a lot of work on improving WebKit’s implementation of MathML, which may ship with Chrome 24.

WebKit’s Content Security Policy implementation now features supports for paths in directives’ values. Blocked inline scripts will cause Web Inspector to pause, ignored directives due to non-ASCII values will now generate warnings and JavaScriptCore’s description when blocking eval() has been clarified.

Other changes which occurred in the last two weeks:

If you happen to be at Fronteers 2012 this Thursday and Friday, please come say hi! If you’re not: too bad, you’re missing out :).

Read more (no comments) »

Clipping element painting and the Media Source API for Chromium

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 23

This update discusses the 1,305 WebKit changes up to revision 128,016, and the 1,707 Chromium changes up to revision 155668, and is therefore covering the last two weeks.

Within Web Inspector, the $() function now aliases querySelector rather than getElementById, meaning you can also select on classes, elements or more advanced selectors. Stylesheets using SASS’ SCSS format will now be highlighted. The experimental WebGL front-end is now able to link you the relevant call in the source code and status bar glyphs now have high-DPI images.

Support for the overflow-wrap property has been added, which is a new property to which word-wrap is a shorthand. Within the calc() function, expressions using the “em” unit will now zoom correctly and it’s now possible to use CSS Variables within expressions, assuming support for both is available in your build. Robert fixed yet another CSS 2.1 issue, so WebKit now prevents the margins of collapsed blocks from collapsing with parent margins.

Dirk introduced the “clip-path” CSS property into WebKit, which restricts the region of an element that can be painted. Changes landed making this work for both HTML and SVG elements, together with a fix which makes sure that the correct origin of polygons will be applied.

Using Content Security Policy will now disable dynamic script evaluation in workers. Automatic features (i.e. autoplay) will now work in sandboxed iframes if they allow scripts and TextTrack modes will now be reported as strings. MediaSource objects now have a duration property, non-anchored <dialog> elements will now be vertically centered and dynamically removing preserve-3d from a layer now yields the wanted effect. Finally, the MediaSource, SourceBuffer and SourceBufferList objects have received WebKit-specific prefixes.

Tommy has been working on WebRTC’s PeerConnection interface, adding the asynchronous createOffer method, the createAnswer method, ICE-related functionality and support for local and remote descriptions.

In terms of experimental features, Dave’s been working on the new Multiple Column implementation again, and added support for painting the contentscolumn repainting and unforced column breaking, next to some clean-ups. The CSS Shaders implementation now features various new blending and compositing modes.

Other changes which occurred in the last two weeks:

And that’s it again, thanks for reading! For Chromium OS updates, François published some great updates again.

Read more (3 comments) »

WebGL Inspection, Sticky Positioning and Windows 8 Updates

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 23

Last week saw 993 Chromium commits and 650 WebKit ones, totaling up to 1,643 changes in total.

Chrome binaries will now be signed with compatibility GUIDs for Windows 8, which mainly impacts theming in High Contrast mode and heuristics about potential compatibility issues. Furthermore, forwarding of search queries in Windows 8 UI mode has been implemented, and mouse input events from styli will no longer be ignored.

Web Inspector’s Profile panel is getting a great new (experimental!) feature from Andrey, namely WebGL inspection. The Timeline panel is now able to show the cause for a style recalculation, the console.time() method now uses for more accuracy and more work has been done on improving performance.

Simon landed support for sticky CSS positioning, which limits an element to be positioned within both it’s container and the viewport. Support for parsing the -webkit-text-decoration-style has been added, the arguments for the blend-mode property can now be parsed and CSS masking and filters are now being applied in the right order.

Blob and File System URIs are now considered to be same-origin for Content Security Policy and computed styles for 2D Transforms have been aligned with the specification. An initial implementation of CSS Exclusions’ shape-inside property landed, WebKit didn’t miss out on the usual set of Flexbox improvements and David’s work on re-implementing Multiple Columns on top of CSS Regions saw two more commits.

The postMessage() function now accepts any kind of data as its message, allowing you to post arrays and objects as well. Changing the class attribute on any kind of element will now update the classList as well, and work is being done for allowing pointer lock in sandboxed iframes. The automatic DOM transactions feature for Undo Manager is now implemented, just like the item() method, and the undoscope attribute has been removed.

Another new feature which is in the works, is being able to use the “overflow-y” property as a way to make the render view paginated, as part of implementing the Generated Content for Paged Media specification.

Other changes which occurred last week:

To finish with some other nice news, yours truly became a full Chromium committer last week :--).

Read more (3 comments) »

Filtering Network Requests, Blend Mode and two more CSP Directives

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 23

Last week, 764 Chromium commits and 615 WebKit commits landed, totaling up to 1,379 changes.

Especially for Web Applications, finding certain files in the Network tab can be difficult, as there can be hundreds. Web Inspector now gained support for filtering the display based on search results! The BlackBerry 10 user-agent can now be selected in the Settings dialog, and work is being done to improve performance by loading panels lazily.

Parsing support for CSS’ blend-mode property, defined in the CSS Compositing and Blending specification, has landed. The volume sliders for fullscreen and normal media elements will now stay in sync, the first call to webkitRequestAnimationFrame won’t return 0 anymore and z-indexes now work on flexible items without explicitly positioning them.

SVG Filters can now be drawn in the correct colorspace for WebKit ports which don’t use CoreGraphics. Mike implemented the plugin-types and form-action Content Security Policy directives, together with their respective DOM APIs, and support for author Shadow DOM is now available for the <meter> element. Finally, many more languages now have their localized quotes available for the <q> element.

Other changes which occurred last week:

  • The third-party storage blocking system now also covers WebSQL databases.
  • A compile time flag was added for the new CSS 3 text decoration properties.
  • Chromium received a new audio render method supporting synchronized input and output.
  • Sticky CSS positioning has been enabled on Apple’s Windows port.
  • DNS Prefetching has been enabled for the BlackBerry WebKit port.
  • Gyuyoung Kim is the latest member of the WebKit Reviewer team, congratulations!
  • Within Chrome OS, the offset for a secondary monitor can now be set.

Various new features are still under development in WebKit, and may be near the horizon: @supports and parts of Generated Content for Paged Media (GCPM).

Read more (1 comment) »

Chromium 23, CodeMirror Editing and a flag for CSS Exclusions

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 23

Last week, 831 commits were added to the Chromium project and 665 to WebKit, totaling up to 1,496 changes.

Jim Carrey is going to be very pleased with this change made by Anthony last week, namely kicking Chromium to Number 23. You can read about many changes made for Chrome 22 in this series of articles.

Web Inspector’s editor can now be replaced with CodeMirror by Jan Keromnes, as an experimental feature. It supports basic editing, search, replace and saving, but much more work is to be done before it’s completely usable. The function scope is now visible in the UI, and support for two CSS Region events has been added to the protocol.

A new “all” value for the -webkit-user-select property can now be parsed and initial support for text-decoration-line landed. Four more bugs in the Flexible Box Module implementation were fixed, namely the lack of support for inline flexingpercentage sizing in quirks mode, percent-based margins and behavior when using box-sizing.

ArrayBufferView objects can now be send through Web Sockets, the indexed getter for Microdata will now return undefined instead of empty strings, classList can now remove classes with uppercase characters and window.URL has been unprefixed. The <progress> element now supports author Shadow DOM. Content Security Policy now is nosier about errors and more work was done on CSS Region’s CSSOM implementation.

In terms of new features, a compile-time flag for CSS Hierarchies has been added, and work is being done on implementing Proximity Events in WebKit.

Other changes which occurred last week:

That’s it again, thanks for reading!

Read more (1 comment) »

Key Bindings for Extensions and Media Streams for the Web Audio API

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 22

A total of 1,599 commits landed last week, 745 for WebKit and 854 for Chromium.

Extensions using script badges will soon be able to use the Command API, allowing them to declare keyboard shortcuts for triggering events on an extension. Browser integration will become a lot richer with this addition!

The classList property moved from HTMLElement to Element, so may now be used with other types of elements as well — for example, SVG elements. Implementation of a MediaStreamAudioSourceNode for the Web Audio API has begun and audio destinations now support local and live audio input. For the CSS Regions implementation, the regionLayoutUpdate event will fire on the NamedFlow object now.

Sliders with a <datalist> attached to them will now have their handle snap to the available options, and an implementation for using <datalist> with color input-fields has been added for Chromium. The webkit prefix has been dropped from the Vibration API implementation as it reached Candidate Recommendation. Overflow will no longer apply to table rows and row-groups, instead, it only applies to block containers, and a bunch of improvements have been made to the Flexible Box implementation as well.

A setting and API has been added to WebKit2 ports, introducing an option to disable third parties from being able to store data. Besides blocking cookies, this will also encapsulate storage APIs such as localStorage.

Other changes which occurred last week:

  • An API has been added for WebKit2 ports introducing an option for blocking third-party storage.
  • Work is being done on re-implementing support for quotes and the <q> element.
  • Web Inspector’s User Agent setting screen has been renamed to Overrides.
  • The Pointer Lock API has been blocked for sandboxed iframes, and the old API has been removed.
  • Support for CSS Filters has been enabled for the BlackBerry port.
  • Chromium’s Mac OS X deployment target has changed to 10.6, deprecating Leopard.
  • Speculative resource pre-fetching has been enabled for 90% of the users using Dev or Canary.

Last week of the Olympics. Especially for those of you in London, enjoy!

Read more (1 comment) »

Content Security Policy API, Flexible Animations and Sticky Positioning

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 22

A total of 1,517 commits landed last week, 692 for WebKit and 825 for Chromium.

Web Inspector’s Settings dialog has received a new experimental option to override the Geolocation results. Experimental support for supporting SASS source-maps has been implemented as well, and drag and drop won’t be started anymore when using right clicks.

CSS Transitions and Animations now work between different types of length units, for example from percentage to pixel-based widths. For the Flexible Box Module implementation, percentage-sizes items will now wrap properly and the “order” property will now influence the painting order as well.

Mike added a JavaScript interface for Content Security Policy, enabling authors to apply feature detection to determine the limitations applied to their content. Initializing TypedArrays based on other TypedArrays has been sped up by 3 to 30 times, the undoscope property is now supported and Microdata’s PropertyNodeList interface has been implemented.

As for new features, a build flag was added announcing work on CSS Blending and Compositing. Simon started working on implementing sticky positioning, starting with the compile-time flag and parsing support. Sticky positioning is useful for elements that should remain visible on the screen regardless of the scrolling position, while also sticking to their containing element.

Other changes which occurred last week:

Revision 123,456 for WebKit also landed, last week!

Read more (1 comment) »

Find & Replace, a Slider’s Tick Marks and Image Orientation

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 22

Last week, WebKit received 621 commits whereas Chromium received 810, totaling up to 1,431. They were made by 373 different authors, and include a change adding search and replace to Web Inspector.

Find and replace functionality for source files has been added to Web Inspector, after less than a day of being experimental. Furthermore, an icon has been added for pausing JavaScript debugging.

The top property on the window object no longer is replaceable. It’s now possible to apply Shadow DOM to image elements, invalid script-nonce directives for Content Security Policy will cause WebKit to block script execution and  the calculation for serializing CSS rgba() functions has been corrected.

Sliders can now have tick marks painted if they have an associated datalist, and behavior of negative values for text-indent has been aligned with CSS 2.1. As for experimental work, a compile time flag and parsing support for the image-orientation CSS property have landed. Initial support for positioning grid items by their row and column index is now available as well, and displaying dialogs will now take the open attribute into account.

Other changes which occurred last week:

That’s it again, thanks for reading.

Read more (3 comments) »

HTML5 Dialog Element and getUserMedia() for Chrome Frame

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 22

Last week brought 1,433 commits to the repositories, 611 for WebKit and 822 for Chromium, made by 357 different authors. Highlights include work on the <dialog> element and removal of the hixie-76 protocol.

Within Web Inspector, the looks of the find bar have been updated, and several other parts of the UI are also receiving refreshments. Furthermore, the tab size now defaults to four spaces.

The CSS 3 blur filter will now work correctly when it’s applied to the parent of a fixed position element, and support for min-height and min-width in the CSS Flexible Box Module has been implemented, including the implied minimum size of flex items. The state of state-less form controls, such as password fields, won’t be stored anymore. Date and time input types are now supported by the BlackBerry port as well.

Backwards iteration over HTML Collections no longer has O(n2) performance, making it significantly faster. For CSS Regions, the firstEmptyRegionIndex attribute has been implemented for Named Flows and the getRegionsByContentNode method had “Node” dropped from its name.

A compile time flag has landed, marking the beginnings of an implementation of the HTML5 <dialog> element. Meanwhile, support for the old hixie-76 Web Socket protocol has been removed.

Other changes which occurred last week:

Thanks for reading!

Read more (2 comments) »

Scroll into View, XHR with ArrayBufferViews and Text Autosizing

Published on in Google Chrome, Last Week, tech, WebKit. Version: Chrome 22

With just 770 commits last week, 333 at Chromium and 437 at WebKit, the impact of the Independence Day celebrations is quite visible. Since the open-sourcing of Chromium in 2008, there have been only 11 weeks during which WebKit received more commits than Chromium.

The context menu for nodes in Web Inspector now includes a “Scroll into view” item. Snippets can be evaluated and the visual appearance of Web Socket frames has been improved.

Following I/O’s Chrome for iOS announcement, first steps are being made towards upstreaming the iOS code.

XMLHttpRequest’s send() method is now able to transmit ArrayBufferViews, the “script-nonce” directive from the Content Security Policy specification has been implemented, and a basic framework for Text Autosizing had landed.

BlackBerry enabled support for the Microdata API and scoped stylesheets on their port. EFL also enabled some features, namely support for both the Gamepad and the Microdata APIs.

Read more (4 comments) »