wiki:WebKit plus SVG

Version 6 (modified by trac, 15 years ago) (diff)

--

This is the wiki page covering all that involves the SVG work being done in WebKit.

NOTE: WebKit+SVG is NOT ready for general usage. If you're not a developer (or really hate buggy software) you will be disappointed.

WebKit+SVG News

  • 2005-09-27 — Safari+SVG now available! : It's now possible to build WebKit w/ SVG support, thus it's now possible to run Safari w/ build in SVG viewing capabilities. Bdash has made nightly WebKit+SVG builds available. NOTE: SVG support in Safari is even MORE LIMITED than what is available in DrawTest. Animations, JavaScript and Text are all disabled for now.
  • 2005-09-25 — SVG Scripts Update : Two of the SVG scripts have gone away, rolled back into their WebKit counterparts: checkout-svg is now checkout --svg, build-webcore-svg is now build-webkit --svg. Yes, as you might guess this means you can now build SVG support right into WebKit (and Safari), more on that later...
  • 2005-09-07 — Full Steam Ahead! : SVG development has accellerated to an incredible pace over the last month. We now have 5 developers (tobli, pojo, Kompo, rwlbuis, and MacDome) hard at work. We picked up several rounds of changes from KDE (4752, 4790, 4799), fixed several annoying bugs (4697, 4780, 4864), and followed the rest of WebKit in reducing our leaks by an order of magatude! After all that, we sat down to think up "what's next" and have assembled a tenative wiki:WebKit_plus_SVG_Milestones? document to guide us for the next while.
  • 2005-07-29 — Build Scripts, Nightly's and Bug Fixes (oh my!): SVG build scripts are now in CVS (build-webcore-svg and friends). Also bdash has made nightly DrawTest builds available for easy testing! And with pojo2's help we finally nailed the Most SVGs render all black regression!

wiki:WebKit_plus_SVG_Old_News?

Obtaining WebCore+SVG

You no longer have to build your own copy of WebCore+SVG, you can now just grab a wiki:http://bdash.net.nz/files/webkit/nightly/Latest-WebCore-SVG-CVS.dmg? nightly DrawTest build, and skip right to testing if you'd like.

For developers, you will need to do the following:

  • Make sure you have the minimum requirements: 10.4.0 or later, Xcode 2.1 developer tools installed.
  • Grab the latest WebKit sources from anon CVS (follow the normal "Obtaining WebKit" instructions)
  • Grab the WebKit SVG additions (WebKitTools/checkout --svg) you only need to do this once.

Building WebCore+SVG

Once you have obtained WebCore+SVG (above), building is simple:

  • Run build-webkit --svg (this builds the JavaScriptCore+SVG and WebCore+SVG targets)
  • Run build-drawtest (this builds DrawTest.app)
  • Run run-drawtest to actually view svgs. :)

You're now running DrawTest, the Cocoa SVG Test viewer. You'll probably want to grab some SVGs to play with, see "Testing WebCore+SVG" below.

Come complain on #webkit if something doesn't work!

SVG Hitlist bugs

  • 3914 Remove all dynamic_cast from KDOM (pojo & rwlbuis have started, ask on #webkit for more info)
  • 3916 Remove APPLE_COMPILE_HACK from WebCore+SVG
  • 4249 REGRESSION: JavaScript support is busted in WebCore+SVG

Testing WebCore+SVG

WebCore+SVG uses the same testing architecture as WebKit, namely run-webkit-tests However, WebCore+SVG requires you to pass the --svg option to the script like so:

run-webkit-tests --svg

Unfortunately, although we have a good testing infrastructure, we don't have very many SVG tests! If you know of any SVG test suites out there (beyond the W3C one which we are already using), we would be very interested to hear from you.

Another good (visual) way to scan through many tests at once is to build DrawTest.app (outlined above) and use its built-in viewer & test browser to scan over your favorite SVG's looking for rendering errors. DrawTest's built in test browser is designed to allow you to scan over svg + png directories quickly and compare the WebCore's SVG rendering against the png. Great examples of such svg & png collections can be found at:

http://www.openclipart.org/[[BR]] and
http://www.w3.org/Graphics/SVG/Test/ (which is also already in WebCore CVS)

<strong>File bugs for any SVGs which crash or don't render correctly!</strong> (Best of course to have a reduced test case demostrating the render failure, rather than a large complex SVG.)

DrawTest.app

A simple Cocoa app for viewing/interacting with SVGs.

Feature: SVG viewer

To use: File:Open... or double-click on a .svg file in the Finder
<center>
wiki:Image:DrawTestKonquerorLogo.png[[BR?]] wiki:Image:DrawTestScreenShot.png?

<small>DrawTest.app showing Konqueror Logo.svg and FireFox Logo.svg (ironic, eh?)</small>
</center>

Click the button in the upper-right hand corner of the window to toggle the toolbar (and thus zoom/pan controls, etc.) ON/OFF.

NOTE: SVG creation (aka drawing) capabilities of this app are extremely limited. Don't be too surprised if things crash (bug pending), or don't work as expected (4248).

Feature: SVG Test Suite Browser

This is used for scanning through Test Suites, like those from wiki:http://www.w3.org/Graphics/SVG/Test/? W3C, or image libraries like wiki:http://www.openclipart.org/? OpenClipart

To use: Window:Tests Panel, point the Test list to a directory of SVGs, then double-click on one to show the text viewer panel (shown below).
<center>
wiki:Image:DrawTestTestViewer.png?

<small>DrawTest.app showing one of the W3C test cases for filters</small>
</center>