Color input, the Network Information API and Chromium 20

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

1,104 changes landed in Chromium’s repository last week, whereas WebKit’s received 792. Highlights include Chromium 20, support for <input type=color> and re-landing of the vw, vh and vmin CSS units.

Chromium’s latest version number is the only number with more than one digit that can be written from base 2 to base 20 using only the digits 0 to 9: version 20. Highlights of Google Chrome 19 include support for the CSS calc() function, quote some updates to the Extension APIs and support for mutation observers.

A skeleton of Chromium’s Content Shell for Android landed last week, which is the very first step towards being able to build an Android .apk file containing Chromium. Meanwhile, work on supporting Password Generation is also progressing with some new constraints and a user interface for Linux.

Support for IndexedDB in Web Inspector’s Storage Panel is now available by default. Line-endings won’t be re-set anymore after editing a file, heap snapshot parsing has been significantly sped up and the shortcut for going to the previous panel has been changed. Development on supporting snippets is ongoing, as is support for device metrics emulation.

After having been rolled out, support for the vw, vh and vmin CSS units has returned to WebKit. Flexbox’ flex-line-pack property has been implemented and two bugs around the flex-pack property have been fixed. Replaced elements now box-reflect and vertical-align and more progress landed for the new Multiple Column implementation. Finally, CSS Exclusions’ shape-inside and shape-outside had their “wrap-” prefix removed, and now occur in the list of computed style properties.

Support for the Network Information API landed in WebKit, currently only enabled for the EFL port. The “preview” state of the Page Visibility API has been implemented and toggling the “disabled” attribute on a fieldset element will now also effect all form associated elements it contains. Verification for the Sec-WebSocket-Protocol header has been made significantly stricter, cross-origin behavior for XMLHttpRequests seeing redirects has been aligned with the specification, and  images will now have their error event fired when the CORS check fails.

Other changes which occurred last week:

If you’re one of the people interested in charting Dimitri Glazkov’s average arrival time in the office based on his daily good morning wishes to the #chromium IRC channel, Brett Wilson has the perfect solution for you: 6,143 indexed pages spread over 13 books containing all of 2011’s IRC conversations!

Read more (3 comments) »

WTF’s move, image-set() CSS Function and Cross-Origin Scripts

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

With 901 commits at WebKit, and 1,298 at chromium’s, last week boosted up to a massive 2,199 changes to the repositories. Highlights include a that WTF no longer is part of JavaScriptCore, a new image-set() CSS function and SPDY/3 which can now be enabled through about:flags.

Following much discussion and preparation, including e-mail threads going back more than a year, Eric Seidel moved the WTF (Web Template Framework) code out of JavaScriptCore. It initially settled there in 2005 as the kxmlcore directory, after which it got renamed to WTF in 2006 as many more useful classes had been included there.

JavaScript files and stylesheets will now be editable by default in Web Inspector’s Resources Panel. Highlighting of SVG root elements with a custom viewbox has been fixed and Source Maps may now be defined inline.

An initial implementation of the image-set() CSS function landed in WebKit, as was proposed for the CSS Images Level 4 module last month. Mixed percentage and absolute combinations for calc() may now be used for masks, background positioning and image sizing, Hyatt is working on the new Multiple Column implementation and fieldsets won’t stretch to minimum intrinsic width anymore if an explicit width has been specified. Besides various other Flexible Box Layout changes, the flexing algorithm got updated.

The crossorigin attribute may now be specified on script elements, causing WebKit to apply the Cross-Origin Resource Sharing policy on script elements as well. Three DOM-mutating JavaScript errors have been updated to align with the DOM4 specification and WebSocket’s Sec-WebSocket-Accept may not occur multiple times anymore.

Other changes which occurred last week:

Finally, if you have interest in Adobe’s recent work on WebKit, they recently hosted a hackathon which yielded some interesting results. It’s a good read!

Read more (no comments) »

Battery Status API, many form changes and animVal for SVG

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

Exactly 1,234 patches landed in the Chromium repository last week, and 751 in WebKit’s, totaling up to 1,985 changes. Highlights include many form-related changes, the Battery Status API and performance improvements.

All signed and float Typed Arrays will now show up as normal arrays in Web Inspector. Taking heap snapshots should now be 12% faster and work is being done in preparation of supporting snippets in the Script Panel. A meta bug covering that work is available on WebKit’s Bugzilla.

CSS parsing now follows the specification when it unexpectedly runs into the end of a file and widths set on a column group won’t affect a column’s width anymore for fixed-layout tables. Three issues with the Flexible Box Layout implementation have been fixed, the “em” unit will be used correctly even when a :first-line pseudo-element changes the size and calc() can now mix percentages and absolute values for gradients and fonts.

The HTML5 meter and progress elements aren’t form--associated anymore, out-of-document radio buttons are now grouped when associated with a form and the form-attribute for labels had its behavior updated. The outer element is now labelable, while hidden input fields have lost that capability. Despite being reverted, support for color inputs seems to be really close for Chromium now.

Samsung has landed an implementation for the Battery Status API, to be enabled on the EFL port. As for Speech Recognition, stubs for WebCore’s controller and the client landed, as well as the SpeechRecognitionEvent part of the API. The MediaStream’s PeerConnection implementation has been deprecated as it’s moving towards a JSEP API. Meanwhile, Nikolas Zimmermann has been busy implementing proper animVal support for SVG.

Besides support for Mozilla’s FullScreen API, WebKit now also supports the very similar W3C Fullscreen API. The primary differences lie in capital usage for the methods and behavior while exiting fullscreen.

Other changes which occurred last week:

Two patches to keep an eye out for are work on making CSS Shaders compile on Chromium and a new image-set CSS property. That’s it again!

Read more (7 comments) »

Improved calc() support, Managed Mode and Flexible Box wrapping

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

1,728 changes found their way in the repositories last week, 1,013 for Chromium and 715 for WebKit. Highlights include improved support for -webkit-calc(), Number.isNan/isFinite support in v8 and progress on ES6’s modules.

Work is being started to implement one-click login to Chrome in the browser. In a nutshell, when Chrome isn’t connected to a Google Account and you log in to, for example, GMail, the browser will ask whether you want to synchronize your data to your profile. For now, it’s still disabled by default and is very likely to change. Also new in Chromium is work on a Managed Mode API, which will provide a way to pre-configure, lock and force a certain profile.

As for Web Inspector, not all percentage signs will attempt to be substituted anymore, the Network Panel will show application/json data again and inactive properties will be checked for vendor prefixes. The button allowing you to toggle the Timeline Panel’s overview mode has been moved and the Inspector has gotten more efficient at inspecting arrays containing large (~a million) elements.

WebKit’s implementation of the CSS calc() function is now able to mix absolute values and percentages for lengths. The Flexible Box Module’s flex-wrap property has been implemented, also for reversed wrapping, and margins won’t be double counted anymore when baseline alignment is used. Finally, multiple values are now accepted for the unicode-bidi CSS property, as an union with bidi-override and isolate is now valid.

Three changes to the JavaScript Speech API have landed, namely the SpeechRecognition(Alternative, Error, Result, ResultList) and the SpeechGrammar(List) interfaces. Support for SVG’s transform-origin attribute has been implemented, getComputedStyle’s result for the height property no longer takes intrinsic paddings into account and rendering of the <shadow> element is now implemented, defining the insertion point for older shadow sub-trees.

Within v8, the Object.is() and Number.isNan/isFinite methods have been implemented. Basic infrastructure for JavaScript ES6 modules is available, and the result of Math.sqrt() will now be consistent on Intel platforms.

Other changes which occurred last week:

Thanks for reading 🙂

Read more (3 comments) »

Viewport-relative CSS Units, Speech API and synchronized Extension Settings

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

Another 1,806 changes landed in both repositories last week, 755 for WebKit and 1,051 for Chromium. Highlights include new viewport-relative CSS units, work on a JavaScript Speech API and ..

Within Chromium, a new page on the New Tab Page has been added aiming to provide suggestions of pages to visit, which can be enabled through about:flags if you’d like to follow the progress. As for extensions, Settings will now be synchronized by default, the Font Settings API has received a setFontName method and a sample extension demonstrating the Download API’s download() method is now available.

Style declarations within Web Inspector can now be added anywhere in the declaration rather than just at the end. The DOM counter graphs aren’t experimental anymore, color pickers will be closed when either escape or enter gets pressed and timeline records will be opened when you click on a DOM counter graph. Furthermore, the Profiles panel has been enabled for Web Workers and suggestions will now be given for Watch Expressions.

WebKit now supports an intra-line character grid for Japanese text layouts. The initial value for the -webkit-flow-into CSS property has been changed to “none”, the display type for inline flexboxen is now supported and David Barton is continuing his work on improving MathML support, this time by fixing <msubsup> formatting. The :empty pseudo-selector won’t apply anymore when scripted additions occur, clipping behavior for a fieldset’s <legend> element has been fixed and the :scope pseudo-class is now supported as well.

The Shadow DOM’s ShadowRoot has been taught about the innerHTML property, and the <content> element will now behave like an unknown HTML element when it’s used outside of a Shadow DOM sub-tree. Microdata’s property collections gained the namedItem method and the NamedFlow object for the CSS Region implementation now has the getRegionsByContentNode method. SVG’s <use> element has been integrated with the Shadow Root implementation and work is being done to stop SVG from mutating CSS styles directly.

Joe Thomas landed support for three new CSS units: vw, vh and vmin. These units allow you to define sizes based on the viewport’s width, height or smallest of the two. Following an announcement on webkit-dev, Hans landed an initial patch towards implementing the JavaScript Speech API.

Other changes which occurred last week:

And that’ll be all again, cheers for reading.

Read more (1 comment) »

Scoped Styles, Deflated WebSockets and the Vibration API

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

Last week, 912 commits landed in Chromium and 754 at WebKit, totaling up to 1,666 changes. Highlights include scoped stylesheets, parsing of properties for the Grid Layout and a new interpreter for Apple’s JavaScript engine.

Two new extension APIs have been added to Chromium, namely a fontSettings API which will (so far) allow you to retrieve the font family for a given script, and a Key Bindings API  which allows you to register shortcuts triggering events in your extension. An API has been added allowing the Chrome Web Store to install multiple extensions at once, and extensions now also support icons sized either 256×256 or 512×512 pixels.

A command line flag and an about:flags entry have been added to Chromium allowing you to enable support for scoped stylesheets. CSS rules declared in <style scoped> elements will only apply to the subtree rooted at the style element’s parent element, which will prove to be really useful for components and better encapsulation of styles.

Web Inspector’s Audit Panel gained the ability to warn developers about CSS properties which should be unprefixed. The Ctrl/Cmd {+,-,0} key combinations may now be used to control zooming of the inspector, attributes containing links can now be properly selected in the Elements Panel and, while it’s not enabled by default yet, managing IndexedDB is making visual progress now. Showing re-paint rectangles is now an Inspector option and three patches landed preparing changes in the Timeline Panel, such as the ability to align events by their start time.

Following inflator and deflator classes, WebKit’s WebSocket implementation now supports per-frame compression through the DEFLATE extension. Samsung’s Kihong Kwon landed initial support for the Vibration API. The zero-width joiner (0x200D) and non-joiner (0x200C) characters are now recognized by the JSC and v8 lexers, the PopStateEvent’s state property now equals history’s state property’s value and spin buttons now fire two events.

Initial parsing support for the grid-column and grid-row CSS properties has been added as part of support for the CSS Grid Layout module. <rt> elements won’t inherit the text-decoration property anymore, file upload controls can now stretch to make sure the text fits in the label and the click event for transformed SVG elements now is reliable.

Apple’s JavaScriptCore is now a triple-tier virtual machine, adding a new low level interpreter which is 2 to 2.5 times as fast as the old one. While performance of the triple-tiering engine is neutral on performance tests, reducing the amount of JIT’ed code delivers strong performance improvements on actual websites.

Other changes which occurred last week:

Last week also happened to be Evan Martin’s last week as a member of the Google Chrome team. Besides having made more than 1,400 commits, Evan has had tremendous impact on the project ever since he started working on it. Thanks, and good luck on your next endeavours!

Read more (1 comment) »

Calculated CSS Values, a Color Picker and the Translate Attribute

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

Another 1,642 changes landed in the repositories last week, 958 for Chromium and 684 for WebKit. Highlights include a color picker for Web Inspector and early functionality for the calc() function.

Brian Grinstead’s color picker is now enabled by default in WebKit nightlies, following some slight polishing. To aid the undo and redo system, an event has been added to monitor CSS modifications, percentage calculation for empty heap snapshotshas been fixed and the first UI for managing IndexedDB databases is available. The free-flow DOM editing experiment has endedconcluding that it wasn’t an optimal solution for highly dynamic pages. Single-click CSS editing did however get enabled by default, and the Elements Panel will now show previews for images.

Per Mike’s commit, basic usage of CSS’ calc() function have started to work in WebKit. Two new CSS properties have been added, -webkit-line-grid to support the alignment of lines in the inline direction to the line grid and -webkit-overflow-scrolling, indicating that an element with overflow scrolling should follow the platform’s behavior. Nested horizontal flexboxes for the new implementation have been fixed, the nowrap value for the flex-wrap property has been renamed to “none” and the computed style for auto flex-item-align now resolves to its parent’s flex-align.

All HTML elements now support the translate attribute. Support for the DOM Level 3 FocusEvent class has been added and the “types” attribute for HTML5’s drag and drop Clipboard object now returns a DOMStringList. As for CSS Regions, it’s now possible to check whether a named flow overflows and update the regionOverflow property for all elements. Finally, a repaint issue and a text selection issue related to Regions have been fixed as well.

Other changes which occurred last week:

And that was an update from London again, thanks for reading!

Read more (2 comments) »

Mutation Observers, Reversed Animations and Faster JPEGs

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

With 995 commits to Chromium’s repository and 754 to WebKit’s, last week brought in another 1,749 changes to the projects. Highlights include Mutation Observers being enabled for all WebKit ports and reversed CSS Animations.

Web Inspector’s Heap Profiler overview screen got some UI improvements and will now show percentages by default next to absolute usage numbers. Hovering over elements with :hover styles defined won’t lock up anymore, the debug side-bar in the Script Panel can now be hidden and DOM edits can now be undone. Brian Grinstead contributed a color picker, bridging the gap until actual <input type=color> gains support. Touch events are now supported by Web Inspector, and can be enabled through the Settings panel.

Mutation Observers have been enabled by default on all WebKit ports. The click() method is now implemented on HTMLElement, making it available for all elements in the DOM. URLs specified in <a ping> won’t be lowercased anymore, the state attribute has been added to the History’s DOM interface and the MediaStream API now supports the onstatechange event for PeerConnection. Finally, the Shadow DOM’s <shadow> element has been added.

Reverse directions for CSS Animations are now available. The calc() function can now, in limited fashion, be used with the hsl() and rgb() functions, and no longer supports the mod operator. Flexboxes can now center and refactorings are being done in preparation of multi-line support. unicode-bidi: plaintext is now supported for inline elements and line-grid-snap has been renamed line-snap.

With 41 commits in total, Haraken did another round of IDL cleanups.

Other changes which occurred last week:

And that’ll be today’s update live from Mountain View :).

Read more (3 comments) »

Bringing Google Chrome to Android

Published on in Google Chrome, tech, WebKit.

Finally we’re able to provide an answer to the many rumors which have been going around in the past few months: Google Chrome is now available for Android devices running Ice Cream Sandwich. On my Galaxy Nexus, the browser scores 343 points on html5test.com, runs the SunSpider test in 1880ms and scores 1308 points on the v8 test.

Support for the Web Platform
The first beta uses the same basis as Google Chrome 16, meaning it has most Chromium and WebKit changes up to mid October 2011. I’ve already iterated through many of the changes which were included in that release, most of which will apply for the Android version as well.

To name some highlights, Chrome for Android supports pretty much all of the Web Platform’s exciting features, including CSS 3D Transforms, GPU accelerated canvas, CSS Animations, SVG, WebSockets (including binary messages!) and Dedicated Workers. It supports IndexedDB, Application Cache and the File APIs, date and time pickers, parts of the Media Capture API and mobile oriented features such as Device Orientation and Geolocation. Fixed positioned elements are also working and even look smooth while scrolling!

What the Android-based Chrome does not support is Flash, following Adobe’s announcement in November. Other unsupported features in the beta release are Extensions/Apps, WebGL, Shared Web Workers and the Web Audio API.

An issue that often pops up for mobile browsers is that text on the website may be too small to read properly. Where the Android Browser employs a text reflow algorithm to clarify the situation, Chrome for Android features a technique which we’ve called Font Boosting. It uses an algorithm to increase font sizes when necessary, aiming to make the text readable regardless of the zoom level.

And for the Web Developers among you, it’s also possible to utilize Web Inspector’s Remote Debugging feature to inspect and modify pages while viewing it on the device itself.

Google Chrome 16 and mobile limitations
Of course, bringing a browser to a different -much more limited- platform goes further than simply re-using code. Mobile devices have a lot of limitations compared to desktop and laptop machines. Besides the lower amount of available memory and CPU power, other constraints lie in less memory bandwidth and VRAM on the device’s GPU. Google Chrome has a complicated architecture which imposed some interesting challenges here: separating the browser from the renderers through its multiple process architecture, to name an example. Decreased rendering and scrolling performance were also an issue, to which Chrome’s GPU team provided an excellent answer in the form of a threaded compositor.

Another characteristic of the Android platform is that the APIs for most significant features are exposed through the Android SDK, making them available to Java code. To this end, part of the browser layer has actually been implemented in Java, communicating with the rest of the Chromium and WebKit code through Java Native Bindings.

Becoming part of the Chromium project: upstreaming our code
Chrome for Android has been developed in a separate repository as a fork, which means that most of the code will have to be upstreamed. To date, about 150 commits have landed in Chromium making many preparations, including the build environment and bots for Chromium and WebKit, not to mention WebKit’s umbrella bug and the two announcements.

As having a fork is far from ideal, one of the current top priorities will be to upstream most new and modified code to Chromium and WebKit, while the build and testing infrastructure on Chromium’s waterfalls is expected to evolve significantly. A snapshot of the current source-code of Chrome for Android can be downloaded as a tarball.

Of course, keep in mind that today’s release is just a beta; much more work, features and stability will be needed to actually be able to release the first stable version. Personally, I’m very glad that the project has been announced, and definitely am looking forward to continuing development in the open!

Read more (24 comments) »

Chromium 19, Scoped Stylesheets and IDL Refactoring

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

1,368 changes found their way to the repositories last week, 802 for Chromium and 566 for WebKit. Highlights include Chromium 19, an Extension Activity Log page and no more high-latency audio code path.

The branch for Google Chrome 18 has been created, giving Anthony a cause to remind us about Potassium while kicking Chromium’s version 19. Approximately 6,500 Chromium, 4,400 WebKit commits and 300 v8 commits participated in this release, giving a combined total of over 11 thousand changes. Chrome 18 brings six new stable extension APIs, a CSS Selector Profiler, Mutation Observers and many, many more changes.

Work has been started on an Extension Activity Log page which will share information about API calls a certain extension makes, allowing you to keep an eye out on their behavior.

Web Inspector’s Heap Inspector is now able to show a percentage-based representation of memory usage for objects as well. The protocol version has been increased to 1.0, getting an XPath query for an item in the DOM will soon be supported and an experiment for editing styles after a single click has been started. Finally, it’s now also possible to select BlackBerry’s UA strings in the Inspector’s switcher. Work on supporting touch event emulation is progressing.

Support for fixed and percentage-based minimum widths on table elements with table-layout: auto has been implemented, and styling background colors in regions has been re-enabled as well. The preload scanner will now take the base element into account and the disabled attribute on SVG style elements is now supported.

Albeit disabled by default through a compile-time flag, basic functionality of scoped stylesheets has started working per Ronald’s commit. Limitations for selector matching in the <content> element’s select attribute are now being verified, backgrounds inside SVG’s foreignObject element will now be drawn, the Content-Language value (meta-only for now) will influence the document’s locale and fonts and SVG’s getIntersectionList method won’t cause visual distortion anymore.

Through 19 different commitsKentaro Hara has been doing a great job cleaning up IDL files throughout WebKit .

Other changes which occurred last week:

And that’s all again!

Read more (3 comments) »