Top Banner
Writing Tools using WebKit ARIYA HIDAYAT ENGINEERING DIRECTOR, SENCHA
39

Writing Tools using WebKit

May 24, 2015

Download

Technology

Ariya Hidayat

Slides from the Pivotal Labs Tech Talk
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: Writing Tools using WebKit

Writing Toolsusing WebKit

ARIYA HIDAYATENGINEERING DIRECTOR, SENCHA

Page 2: Writing Tools using WebKit

whoami

Page 3: Writing Tools using WebKit

Let’s Start the PARTY

Page 4: Writing Tools using WebKit

Let’s Start the PARTY

Page 5: Writing Tools using WebKit

Unintentional Regression

This is awesome!

Page 6: Writing Tools using WebKit

forget to run

the tests

REGRESSION

Unintentional Regression

This is awesome!

Page 7: Writing Tools using WebKit

forget to run

the tests

REGRESSION

Unintentional Regression

This is awesome!

Page 8: Writing Tools using WebKit

Pre-commit hook tocommand line test runner

Page 9: Writing Tools using WebKit

Using WebView

QWebView webView;webView.show();webView.setUrl(QUrl("http://www.sencha.com"));

Page 10: Writing Tools using WebKit

Capture to Image

QWebPage page;QImage image(size, QImage::Format_ARGB32_Premultiplied);image.fill(Qt::transparent);QPainter p(&image);page.mainFrame()->render(&p);p.end();image.save(fileName);

Page 11: Writing Tools using WebKit

Test Runner

specrunner SpecRunner.html5 specs, 0 failures in 0.013s

specrunner SpecRunner.htmlFAIL: 5 specs, 1 failure in 0.014s

Page 12: Writing Tools using WebKit

Network Log

28: GET http://www.google.com/m/gp292: Response 200 application/xhtml+xml; charset=UTF-8 0 bytes http://www.google.com/m/gp311: GET data:image/gif;base64,R0lGODlhiA...312: GET data:image/gif;base64,R0lGODlhJA...312: GET data:image/gif;base64,R0lGODlhGA...312: Response 0 image/gif 3611 bytes data:image/gif;base64,R0lGODlhiA...312: Finish fail data:image/gif;base64,R0lGODlhiA...312: Response 0 image/gif 284 bytes data:image/gif;base64,R0lGODlhJA...312: Finish fail data:image/gif;base64,R0lGODlhJA...312: Response 0 image/gif 178 bytes data:image/gif;base64,R0lGODlhGA...312: Finish fail data:image/gif;base64,R0lGODlhGA...317: Response 200 application/xhtml+xml; charset=UTF-8 0 bytes http://www.google.com/m/gp324: Finish fail http://www.google.com/m/gp328: GET http://www.google.com/m/gn/user?...329: Finish success http://www.google.com/m/gn/user?...

Page 13: Writing Tools using WebKit

Recorder & Replayer

Page 14: Writing Tools using WebKit

Remote Console for

http://github.com/senchalabs/android-tools

Page 15: Writing Tools using WebKit

Remote Console for

http://github.com/senchalabs/android-tools

Page 16: Writing Tools using WebKit

THANK YOU!

Page 17: Writing Tools using WebKit

QUESTIONS?

ariya @ sencha.com

ariyahidayat

ariya.blogspot.com

Page 18: Writing Tools using WebKit

ADDENDUM

Page 19: Writing Tools using WebKit

Around the Project

Page 20: Writing Tools using WebKit

0

10000

20000

30000

40000

50000

60000

70000

80000

0 1 2 3 4 5 6 7 8 9 10

Rev

isio

ns

Years

History

Page 21: Writing Tools using WebKit

0

10000

20000

30000

40000

50000

60000

70000

80000

0 1 2 3 4 5 6 7 8 9 10

Rev

isio

ns

Years

History~2000 commits/month

Page 22: Writing Tools using WebKit

Level of Involvement

Contributor

Committer

≈ 130 Reviewer

≈ 80accept or reject patches

checks in reviewed patches

after 10-20 patches

after 80 patches

Page 23: Writing Tools using WebKit

WebKit ReviewersApple

38

Google19

Nokia7

RIM6

Misc12

Page 24: Writing Tools using WebKit

WebKit ReviewersApple

38

Google19

Nokia7

RIM6

Misc12

1

Page 25: Writing Tools using WebKit

Components of WebKit

WebKit Library

JavaScriptCore

WebCore

HTML rendering

SVG

DOM CSS

Page 26: Writing Tools using WebKit

Platform Abstractions

Network Unicode Clipboard

Graphics Theme Events

Thread Geolocation Timer

Page 27: Writing Tools using WebKit

Di!erent “Ports”WebCore graphics

Mac Chromium Qt Gtk

CoreGraphics

Skia

QPainter

Cairo

graphics stack

GraphicsContext

Page 28: Writing Tools using WebKit

Web Browsers

Safari

WebCore + JavaScriptCore

Eclair

WebCore + V8

Chrome Froyo

Page 29: Writing Tools using WebKit

WebKit Everywhere

Browser

Devices

Runtime

Page 30: Writing Tools using WebKit

How Fresh?

Fall 2010Spring 2010

Chrome 7534.7

Safari 5533.18

Android 2.2533.1

Safari 4528.16

AIR 2.5531.9

mid 2009

Page 31: Writing Tools using WebKit

Extensive Tests

the rest229 MB

tests904 MB≈ 20,000 tests

Page 32: Writing Tools using WebKit

Workflow

1Every commit needs to be reviewed

2 Broken commit must be reverted

Page 33: Writing Tools using WebKit

Workflow

1Every commit needs to be reviewed

2 Broken commit must be reverted

quality control

zero-regression policy

Page 34: Writing Tools using WebKit

Get + Build + Launch

Page 35: Writing Tools using WebKit

Requirements

• Subversion or Git• C++ compiler• Perl• Python• Various SDK

Page 36: Writing Tools using WebKit

Using Subversion

svn checkout http://svn.webkit.org/repository/webkit/trunk webkitcd webkit

≈ 880 MB .svn

Page 37: Writing Tools using WebKit

Using git

git clone git://git.webkit.org/WebKit.gitcd WebKit

≈ 1.2 GB .git

Page 38: Writing Tools using WebKit

Build

WebKitTools/Scripts/build-webkit

--qt for Qt, --gtk for Gtk+--debug for “Debug” mode

Page 39: Writing Tools using WebKit

Launch

WebKitTools/Scripts/run-launcher

--qt for Qt, --gtk for Gtk+--debug for “Debug” mode