118677 – Web Inspector: use SVG file format for icons instead of PDF

Bug 118677 - Web Inspector: use SVG file format for icons instead of PDF

Summary: Web Inspector: use SVG file format for icons instead of PDF

Status:	RESOLVED FIXED

Alias:	None

Product:	WebKit
Classification:	Unclassified
Component:	Web Inspector (show other bugs)
Version:	528+ (Nightly build)
Hardware:	All All

Importance:	P2 Normal
Assignee:	Timothy Hatcher

URL:
Keywords:	InRadar

Depends on:	118676 119492
Blocks:
	Show dependency tree / graph

Reported:	2013-07-15 10:01 PDT by Roland Takacs
Modified:	2013-08-09 08:28 PDT (History)
CC List:	5 users (show)

See Also:

Attachments
initial patch (428.61 KB, patch) 2013-07-15 10:06 PDT, Roland Takacs	no flags	Details \| Formatted Diff \| Diff
Before (40.13 KB, image/png) 2013-07-15 10:10 PDT, Roland Takacs	no flags	Details
After (58.50 KB, image/png) 2013-07-15 10:11 PDT, Roland Takacs	no flags	Details
patch (710.85 KB, patch) 2013-07-29 07:17 PDT, Roland Takacs	no flags	Details \| Formatted Diff \| Diff
Patch (529.55 KB, patch) 2013-08-06 13:11 PDT, Timothy Hatcher	no flags	Details \| Formatted Diff \| Diff
Patch (192.97 KB, patch) 2013-08-07 12:51 PDT, Timothy Hatcher	joepeck: review+ timothy: commit-queue-	Details \| Formatted Diff \| Diff
Show Obsolete (2) View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.

Description Roland Takacs 2013-07-15 10:01:29 PDT

A lots of image can't be shown. When I converted them into png format (from pdf), they appeared good.

Comment 1 Radar WebKit Bug Importer 2013-07-15 10:02:18 PDT

<rdar://problem/14444333>

Comment 2 Roland Takacs 2013-07-15 10:06:10 PDT

Created attachment 206672 [details]
initial patch

does anybody know why there are pdf, png, svg formats in the Icons/ folder instead of unified format?

Comment 3 Roland Takacs 2013-07-15 10:07:27 PDT

btw, without this patch I get 'IndexSizeError: DOM Exception 1: Index or size was negative, or greater than the allowed value'.

Comment 4 Roland Takacs 2013-07-15 10:10:30 PDT

Created attachment 206674 [details]
Before

Comment 5 Roland Takacs 2013-07-15 10:11:02 PDT

Created attachment 206675 [details]
After

Comment 6 Timothy Hatcher 2013-07-15 10:54:37 PDT

We use PDF so we don't need to have 2 PNGs for each icon. We need to support Retina displays on Mac.

We have considered using SVGs instead of the PDFs, but have not had a chance to convert things.

Comment 7 Roland Takacs 2013-07-29 07:17:45 PDT

Created attachment 207652 [details]
patch

Converted all PDF icons to SVG with pdf2svg and removed all PDF icons.
Replaced all .pdf references to .svg in WebInspectorUI/UserInterface/ folder.

Tested on Mac and it seems to work.

Comment 8 Timothy Hatcher 2013-07-29 07:26:37 PDT

Comment on attachment 207652 [details]
patch

View in context: https://bugs.webkit.org/attachment.cgi?id=207652&action=review

> Source/WebInspectorUI/UserInterface/Images/DOMCharacterData.svg:4
> +<image id="image5" width="67" height="67" xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEMAAABDCAYAAADHyrhzAAAABmJLR0QA/wD/AP+gvaeTAAAJ60lEQVR4nO1aW2wcVxn+5rozuzO73l1fN67XSRu3Is3FyCkFBKXtG7dKQA1K01AqUFUqHniBdyRUQIgHoE+oUlOSElXcHogqARJIhYJa6gRKmjQhcZzYa6+z3tnd2Zmd++HBjbsze7G9M06dyp+0D+ef/8w5+805/+0cYAc72MEONg5qI0ozJ058q6FUnrI1bdS2LYHYhN7qiYUFw9MOw8d0ISnPyJnM9/ZNT/9tvT5dyfjPqVOPrly9+nyteEOObpq3HhRDYyCfPy+N3fHg/kceKXbU6/TgzAsvfmfh7XM/cG1nQ6vndoCUzTYG7tn/4QNf+tyFds/b/tHzp0594fLMmV9/kIi4ieTQgCqOjo7ef/RoLfiMDQoIIfRfn332eJCIOM+jP5lEjGFBM9ufI8f10LAsLFercDxvTV4r3pClTPZXAD4T7NPyr/774slvXz4z85Nm2YAsY+/wMChq+5MQhGHbODc/D8O212ScIHj5yYPivulpq1m3xSvUasqx5rYY47ecCNt1YTmO72c6DrymL9orBI7D3bkR32e3DYN2DfcbQd2WbWLVtXxze1BORkYEAaAZBjTTRN00YVo2bM8BIZ370DQFlmHA0yxiHIsYx0HkOcT5GBh6Yx5eigmQYgLqhrEms8z6JwE816zXQoZj2WJzW+C4DQ3YDbplYkWto6LrcDf5tT2PwPIcWHBQN9+TUxQFgeOQlSRkJWndDyZynI8M13WHgzqtBpQivrcSdPls66BhWSgoCtSmSUQFQggaloX5chlVXceewcFNrWBCwARlLWREhYKi4IaqgnTbAxFBNQys1Ovol8PFhpGTYbsuriwX0bDs9goUBXlkBOk9u5HKj0HMZMCKIjhRBCsIa2qe68Kq12FWqzBrKvRSCXppBVqxiPrSEjzH8b1W0bTtRYblOPjfUhGW67Q84yUJo/d/BLnDU4glk+u+i2YYCKkUhFSq5RlxXSyeOYPzv/ndmsx23XCTR4RkOK6Ly8utRNAsi90PP4Q7Pv4xMBEYYwCg3iWqGWFs201ERsbVUgmm7SdCzGRw4NhRSENDUQ2zpYiEjGK16nNbACANDWHy60+Cl6R1+xuVCmrX52HV63AtCxTDgBMFiNksEoND4OLiuu+IAqHJsFwHS7WqTxZLpXDoySe6EkFcFwtv/AuF19+AurjYdQyhrw/pPXuQvnM3shN3g5cSYafdFqHJKFaqIN57+5Wiadz7lS93NZJqoYC3XjqFxsrKhsYwKhUszsxgcWYGFE2veqF0xqcTRYwcigzH81DWNJ8sd3gKfeP5Dj2A6tw1nH3hOJweAzHieajMXkVl9qpPzjHhd3yoN5TrdV9QRTMMdj/8UEd9W2/grZMvtSWCZxlwDAuaouARAtt1YbvuhoO2dCK++T8QQCgyqrruaw/uvxexLoHPpdOnYaqqTyYJMeTSacT5WNs+DcuCahhQDQN1w2hLTl88jqwUvjLZMxmu50G3fOUADE9OdtRvKAqWzpz1yWRRXM0puowj8jxEnsdgMgmPEKhGA7VGA4Zlg6YpZBIJpBPre6yNoGcyNNP0bxGOQ3rP7o76i2/O+PRZmsZ4f/+mDB9NUUiJcaTE8Fui7ft77diw/atCzuVAs525LZ3312DTkrThesStQs+zsQLRpjQ02FHXcxxoRX+FPgqDFzV6JyOQg3QLsLTlZXhNidRqYYbvdegtQ89kOIEskRU7h8y25vc6HEOD3obF5Z7J8AIurlv+4Jj+uIKmtpetuImeZxX09gzfedl7jn8VbcNFASAEGXTAKdqNRkfd5goWALje1pcCe0HvZASWetAuNIML2JOgvdku6JkMlvEXl51G58RLyKR9bY8Q3wnXdkHPZPCsnwwzUNNoRkyWIab9hNS6bKv3Cz2TETxcUguFrvp9u8d97ZVAxrsd0DMZ8YD30G+UYNXrHfV33Xefr23aNpaqnVdTJxBCUNF1FBQF80oZFb2zrdosek7U4rHVs86bx4WEEJQuXEBuaqqtfio/hlQ+j+rc3Jqs+C4Zw6nUuqdhluOgomtYrqk+A1yCClkQMD4wEDrXCdU7GfASC6+/0VV/36NfBBPz1y2K1SouFAooKAoquo66aaJhWaibBsqahnmljHcWC3h7YQEFpdLWE6mGgYKihPkrAEIWd/oScShNZb/a9XlU5ubQl29f9hOzWUx89tM4/9vfo/no3XQcLNdaLtJsCmVNQy6TARMiogu5MuItXuXS6Ve6Gsbc1BT2TT8Kmmk5993c2KO7QDVtC0IILCecuw5FBgWgX/ZXwWvXr+Paq6927Td86CAOP/M0shMTmxqPi4sYnpzE1NNP4fAz3wQVIJSEvNsSuqQ8IMso1VVffePyH/8MaXgE2Ym9HftJIyM49LWvQi0UsHLxEpQrV9AoKzBrNXi2DS4RB59IIDE0BDmXQ18+j1R+zLcaokZoMiiKwnh2AJeKi2tmgLgu3jr5Eg4cPYLM3s6EAKsVMjmXw/inHgg7ldCIhOZ4jMdQ0n8Q7FoWzh7/Ja7//TV0vae0jRDZmhvu60M64T/2I66Li384jZlfPL/uEeJmoRWXgcCVqLClgUjvZ4xlswAIlEAGq8zO4vWfPYfsxF7suu8wMnfd1bX+0Q6EENSXlqBcvoKls/+GurDgV6AALqSHipQMiqIwlu0HxyhYVlV/BYgQrLxzESvvXATNMJBHdyE1tnpzR0ilQDflOo5pgDgujEoFjXIZjXIZtfmFrkeSsiC0ZNKbReTXmCiKQi6dgSzGMV9eabmzAaxeUarOXUN17lokY/Ici7Fsf+j3bNkFN1kQcM9IDjdUFcu1Khw3/AXXIGIsi7QkYTCZjKTAvGVkAKurZDCZRL8sQ6lrUHQNmmn07lyo1fuciZiAdCKORExYv88msKVk3ARNUcjKErKyBJcQ6KYJ3TRh2DYsx4HtuvBAQDwPAA2GocBQNFiaBs+yEDgOPMdCisXA0OHsQje0kEHTtC8tDBviBsFQFGRBgCxE+1XXgxtYjjRNt5TaWuIMVhB8dwbqZvS3e281CCEt/4PmubmgXgsZcVl+s7ldrFW3ZfF2MyhWay1nwyzPnwzqtZDBJRI/puj3LLPnEZxbmIdmmkHV2wJL1SpmS8s+mdTfrx167LG/BHXb+qN//PTn55ZnZz/kU6QAkY9B5DlQt0Gq4WF1iwdXBACMHTz43cknjv0oKG/rTZLDg5/QVfVavVRaSzYIwZoXuJ0xPHHXa+2IADokavump8sD42MPSP1Zrd3z2xUDd+6ZkbLZBzs97xq2/fPEiSSjG8dLc3Oft3R9ex6dbwDJoQE1u2vX9w88/vgPu+ltKIY99/LLPDHsZyzL/KhjO9HcJrsFYHn2BicKJ/YfOfKn93suO9jBDj54+D8Nvem8zfc0vgAAAABJRU5ErkJggg=="/>

Most of these SVGs are just wrapping PNGs. That is not the same quality as the original PDFs. I will see if I can convert them here.

Comment 9 Timothy Hatcher 2013-08-05 09:13:13 PDT

I have all the PDFs converted. Will post a patch soon.

Comment 10 Timothy Hatcher 2013-08-05 11:39:33 PDT

I am running into an issue with SVG and canvas. "Unable to get image data from canvas because the canvas has been tainted by cross-origin data."

Comment 11 Timothy Hatcher 2013-08-05 11:54:07 PDT

This likely happens because WebCore::SVGImage does not have virtual bool hasSingleSecurityOrigin() const { return true; }, and PDFDocumentImage does. If hasSingleSecurityOrigin() does not return true the canvas will be tainted.

Comment 12 Timothy Hatcher 2013-08-05 12:12:55 PDT

Yep, adding hasSingleSecurityOrigin() to return true makes it work. But that certainly can't land. I filed a blocking bug 119492.

Comment 13 Timothy Hatcher 2013-08-06 13:11:06 PDT

Created attachment 208211 [details]
Patch

Comment 14 Joseph Pecoraro 2013-08-06 13:22:25 PDT

Comment on attachment 208211 [details]
Patch

rs=me

Comment 15 Timothy Hatcher 2013-08-06 13:46:39 PDT

Landed the first part of this in http://trac.webkit.org/changeset/153761. The rest (42 PDFs) is still blocked on bug 119492.

Comment 16 Timothy Hatcher 2013-08-07 12:51:58 PDT

Created attachment 208293 [details]
Patch

Comment 17 Joseph Pecoraro 2013-08-08 11:52:15 PDT

Comment on attachment 208293 [details]
Patch

r=me

Comment 18 Timothy Hatcher 2013-08-09 08:28:25 PDT

r153894