AuroraMiddleware/skia2
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Update dev docs to reference the new skia debugger (skiaserve)

Browse Source 
This patch adds a new markdown file describing the new debugger along
with instructions on running it locally and a sweet screenshot. The
screenshot has been sized to not be clipped when viewed in production.

The old documentation for the qt-based debugger has been marked as
deprecated and all docs referencing the old debugger have been updated.

BUG=skia:5493
GOLD_TRYBOT_URL= https://gold.skia.org/search?issue=2121673002
NOTRY=true
DOCS_PREVIEW= https://skia.org/?cl=2121673002

Review-Url: https://codereview.chromium.org/2121673002
This commit is contained in:
pdr 2016-07-06 06:10:25 -07:00 committed by Commit bot
parent 2dcb615c6f
commit 1e2a702c19
5 changed files with 135 additions and 112 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

119
site/dev/tools/debugger.md
View File

@ -5,116 +5,25 @@ Introduction
------------ ------------
The Skia Debugger is a graphical tool used to step through and analyze the The Skia Debugger is a graphical tool used to step through and analyze the
contents of the Skia picture format. Pre-requisites include installing the Qt contents of the Skia picture format. The tool is available online at
Library and downloading the Skia code base. [https://debugger.skia.org](https://debugger.skia.org/) or can be run locally.
Qt is available here: http://qt-project.org/downloads. Building and running locally
It can also be installed on linux using
<!--?prettify?-->
~~~~
sudo apt-get install libqt4-dev
~~~~
Note that the debugger has been tested with Qt 4.8.6; it is known not to work
with Qt 5.0RC1 on the Mac.
Design Documents:
https://docs.google.com/a/google.com/document/d/1b8muqVzfbJmYbno9nTv5721V2nlFMfnqXYLNHiSQ4ws/pub
How to build and run
-------------------- --------------------
Because the debugger uses Qt, you'll need to build skia in 64 bit mode: Begin by following the instructions to
[download and build Skia](../../user/quick), then simply build and run the
`skiaserve` tool:
<!--?prettify?--> <!--?prettify lang=sh?-->
GYP_DEFINES="skia_arch_width=64" python bin/sync-and-gyp # Build.
ninja -C out/Debug debugger ninja -C out/Release/skiaserve
out/Debug/debugger
For Windows, Qt ships as 32 bit libraries so to build and run one should just be # Run the debugger locally
able to: out/Release/skiaserve
<!--?prettify?-->
~~~~
cd trunk
make clean gyp
<open solution in VS2010 and build everything>
~~~~
Depending on how your Qt is installed you may also need to define an environment
variable like:
~~~~
GYP_DEFINES=qt_sdk='C:\Qt\4.8.6\'
~~~~
(which needs to be set before you execute 'make gyp')
On Windows, you may need to copy several DLL and PDB files from %QTDIR%\bin into
your executable directory (out/Debug or out/Release):
QtCore4.dll QtCored4.dll QtCored4.pdb
QtGui4.dll QtGuid4.dll QtGuid4.pdb
QtOpenGL4.dll QtOpenGLd4.dll QtOpenGLd4.pdb
Producing SKPs for usage
------------------------
You may either use the Skia testing images (GMs) for use in the debugger or
create your own via chromium.
To create SKPs from Chromium you must download and build chromium on your
platform of choice: http://www.chromium.org/Home
<!--?prettify?-->
~~~~
cd src
make chrome
out/Debug/chrome --no-sandbox --enable-gpu-benchmarking --force-compositing-mode
~~~~
After which go to Tools, Settings, Javascript Console and type:
<!--?prettify?-->
~~~~
chrome.gpuBenchmarking.printToSkPicture(dirname)
~~~~
Using the Debugger
------------------
The debugger is fairly straight forward to use once a picture is loaded in. We
can step through different commands via the up and down keys, and clicking on
the command in the list. We can pause execution of commands with the pause
button in order to inspect the details of the command in the inspector tabs
down below.
Command | Function
-------------|-----------------------------------------------
x | toggles the visibility of the selected command
alt-x | clears all hidden commands
ctrl-x | shows all deleted commands
b | creates a breakpoint on a command
alt-b | clears all breakpoints
ctrl-b | shows all breakpoints
ctrl-r | rewinds the picture to the first command
ctrl-p | plays to the next breakpoint or last command
ctrl-i | Toggles the inspector and settings widgets
ctrl-d | Toggles the directory widget
space | Pauses drawing execution
ctrl-o | Opens a file dialog for loading pictures
ctrl-s | Saves the skp if you deleted any commands
ctrl-shift-s | Saves the skp under the new specified name
ctrl-q | Quits
![Debugger interface](debugger.png)
After running `skiaserve`, follow the instructions to open the debugger in your
local browser. By default the address will be `http://127.0.0.1:8888`.
![Debugger interface](onlinedebugger.png)

BIN
site/dev/tools/onlinedebugger.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 134 KiB

120
site/dev/tools/qtdebugger.md Normal file
View File

@ -0,0 +1,120 @@
Skia Debugger (deprecated)
=============
Introduction
------------
The Skia Debugger is a graphical tool used to step through and analyze the
contents of the Skia picture format. Pre-requisites include installing the Qt
Library and downloading the Skia code base.
Qt is available here: http://qt-project.org/downloads.
It can also be installed on linux using
<!--?prettify?-->
~~~~
sudo apt-get install libqt4-dev
~~~~
Note that the debugger has been tested with Qt 4.8.6; it is known not to work
with Qt 5.0RC1 on the Mac.
Design Documents:
https://docs.google.com/a/google.com/document/d/1b8muqVzfbJmYbno9nTv5721V2nlFMfnqXYLNHiSQ4ws/pub
How to build and run
--------------------
Because the debugger uses Qt, you'll need to build skia in 64 bit mode:
<!--?prettify?-->
GYP_DEFINES="skia_arch_width=64" python bin/sync-and-gyp
ninja -C out/Debug debugger
out/Debug/debugger
For Windows, Qt ships as 32 bit libraries so to build and run one should just be
able to:
<!--?prettify?-->
~~~~
cd trunk
make clean gyp
<open solution in VS2010 and build everything>
~~~~
Depending on how your Qt is installed you may also need to define an environment
variable like:
~~~~
GYP_DEFINES=qt_sdk='C:\Qt\4.8.6\'
~~~~
(which needs to be set before you execute 'make gyp')
On Windows, you may need to copy several DLL and PDB files from %QTDIR%\bin into
your executable directory (out/Debug or out/Release):
QtCore4.dll QtCored4.dll QtCored4.pdb
QtGui4.dll QtGuid4.dll QtGuid4.pdb
QtOpenGL4.dll QtOpenGLd4.dll QtOpenGLd4.pdb
Producing SKPs for usage
------------------------
You may either use the Skia testing images (GMs) for use in the debugger or
create your own via chromium.
To create SKPs from Chromium you must download and build chromium on your
platform of choice: http://www.chromium.org/Home
<!--?prettify?-->
~~~~
cd src
make chrome
out/Debug/chrome --no-sandbox --enable-gpu-benchmarking --force-compositing-mode
~~~~
After which go to Tools, Settings, Javascript Console and type:
<!--?prettify?-->
~~~~
chrome.gpuBenchmarking.printToSkPicture(dirname)
~~~~
Using the Debugger
------------------
The debugger is fairly straight forward to use once a picture is loaded in. We
can step through different commands via the up and down keys, and clicking on
the command in the list. We can pause execution of commands with the pause
button in order to inspect the details of the command in the inspector tabs
down below.
Command | Function
-------------|-----------------------------------------------
x | toggles the visibility of the selected command
alt-x | clears all hidden commands
ctrl-x | shows all deleted commands
b | creates a breakpoint on a command
alt-b | clears all breakpoints
ctrl-b | shows all breakpoints
ctrl-r | rewinds the picture to the first command
ctrl-p | plays to the next breakpoint or last command
ctrl-i | Toggles the inspector and settings widgets
ctrl-d | Toggles the directory widget
space | Pauses drawing execution
ctrl-o | Opens a file dialog for loading pictures
ctrl-s | Saves the skp if you deleted any commands
ctrl-shift-s | Saves the skp under the new specified name
ctrl-q | Quits
![Debugger interface](debugger.png)

2
site/user/quick/linux.md
View File

@ -65,8 +65,6 @@ Make sure the following have been installed:
* GL, such as **freeglut3-dev** * GL, such as **freeglut3-dev**
* QT4, used by the [Skia Debugger](/dev/tools/debugger): **libqt4-dev**
Check out the source code Check out the source code
------------------------- -------------------------

6
site/user/tips.md
View File

@ -103,15 +103,11 @@ Capture a `.skp` file on a web page in Chromium
3. Execute: `chrome.gpuBenchmarking.printToSkPicture('/tmp')` 3. Execute: `chrome.gpuBenchmarking.printToSkPicture('/tmp')`
This returns "undefined" on success. This returns "undefined" on success.
Open the resulting file in the Skia Debugger, rasterize it with `dm`, Open the resulting file in the [Skia Debugger](/dev/tools/debugger), rasterize it with `dm`,
or use Skia's `SampleApp` to view it: or use Skia's `SampleApp` to view it:
<!--?prettify lang=sh?--> <!--?prettify lang=sh?-->
bin/sync-and-gyp
ninja -C out/Release debugger dm SampleApp
out/Release/debugger /tmp/layer_0.skp &
out/Release/dm --src skp --skps /tmp/layer_0.skp -w /tmp \ out/Release/dm --src skp --skps /tmp/layer_0.skp -w /tmp \
--config 8888 gpu pdf --verbose --config 8888 gpu pdf --verbose
ls -l /tmp/*/skp/layer_0.skp.* ls -l /tmp/*/skp/layer_0.skp.*