QtWebEngine/Features: Difference between revisions

From Qt Wiki
Jump to navigation Jump to search
(Updated qtwebengine DRM instructions to comply with https://bit.ly/2qfTIQ6, using instructions from https://doc.qt.io/qt-5.10/qtwebengine-features.html#audio-and-video-codecs)
Line 1: Line 1:
(Incomplete) list of WebEngine features, and how to test for them.
(Incomplete) list of WebEngine features, and how to test for them. Actively maintained list is available on a dedicated documentation page: [https://doc.qt.io/qt-5/qtwebengine-features.html Qt WebEngine Features]


== Chromium DevTools ==
==Chromium DevTools==


''Version'': Qt 5.4.0 onwards
''Version'': Qt 5.4.0 onwards
Line 7: Line 7:
''Description'': Ability to inspect and debug layout and performance issues of any web content.
''Description'': Ability to inspect and debug layout and performance issues of any web content.


''Documentation'': [http://doc.qt.io/qt-5/qtwebengine-debugging.html Qt WebEngine Developer Tools]
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#chromium-devtools Qt WebEngine Developer Tools] and [http://doc.qt.io/qt-5/qtwebengine-debugging.html Debugging with WebEngine]


''How to test'': Launch a QtWebEngine app with command line option --remote-debugging-port=[your-port] and use a Chrome instance to connect to http://localhost:[your-port]. See documentation for details.
''How to test'': Launch a QtWebEngine app with command line option --remote-debugging-port=[your-port] and use any QtWebEngine-based example browser (from the same version) instance to connect to http://localhost:[your-port]. See documentation for details. Also, widgets' based simplebrowser<ref name=":0">https://doc.qt.io/qt-5/qtwebengine-webenginewidgets-simplebrowser-example.html</ref> and quicknanobrowser<ref name=":1">https://doc.qt.io/qt-5/qtwebengine-webengine-quicknanobrowser-example.html</ref> examples implement opening devtools in a separate view through context menu.


== WebRTC ==
==WebRTC==


''Version'': Qt 5.4.0 onwards
''Version'': Qt 5.4.0 onwards
Line 17: Line 17:
''Description'': Real-Time Communications (RTC) capabilities via simple APIs
''Description'': Real-Time Communications (RTC) capabilities via simple APIs


''Documentation'': -
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#webrtc-feature WebRTC usage]


''How to test'': Set up a webcam / microphone. Open e.g. https://test.webrtc.org/ in simplebrowser, nanobrowser
''How to test'': Set up a webcam / microphone. Open e.g. https://test.webrtc.org/ in simplebrowser<ref name=":0" /> for simple test of supported capabilities. Also https://www.webrtc-experiment.com/RecordRTC/ is good to just test screen recording.


== HTML5 Geolocation ==
==HTML5 Geolocation==


''Version'': Qt 5.5.0 onwards
''Version'': Qt 5.5.0 onwards
Line 27: Line 27:
''Description'': Javascript Geolocation API with QtLocation as a backend
''Description'': Javascript Geolocation API with QtLocation as a backend


''Documentation'': n/a
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#html5-geolocation HTML5 Geolocation]


''How to test'': QtLocation should be built before QtWebEngine. Using demobrowser, go to [http://html5demos.com/geo http://html5demos.com/geo], and allow the page to find your position. Note that on Windows you need an external GPS receiver connected, see [http://doc.qt.io/qt-5/qtpositioning-index.html QtPositioning documentation].
''How to test'': QtLocation should be built before QtWebEngine. Using simplebrowser<ref name=":0" />, go to http://html5demos.com/geo, and allow the page to find your position. Note that on Windows you need an external GPS receiver connected, see [http://doc.qt.io/qt-5/qtpositioning-index.html QtPositioning documentation].


== PPAPI / Adobe Flash ==
==PPAPI / Adobe Flash==


''Version'': Qt 5.6.0 onwards
''Version'': Qt 5.6.0 onwards
Line 37: Line 37:
''Description'': Support for PPAPI plugins, and Flash in particular
''Description'': Support for PPAPI plugins, and Flash in particular


''Documentation'': [http://doc.qt.io/qt-5/qtwebengine-platform-notes.html#pepper-flash-player-plugin-support Pepper Flash Player Plugin Support]
''Documentation'': [http://doc.qt.io/qt-5/qtwebengine-platform-notes.html#pepper-flash-player-plugin-support Pepper Flash Player Plugin Support] and [https://doc.qt.io/qt-5/qtwebengine-features.html#pepper-plugin-api Pepper Flash Player Plugin Support]


''How to test'': Make sure you have the [http://get.adobe.com/flashplayer/otherversions/ Adobe Flash PPAPI plugin installed]. Launch DemoBrowser, NanoBrowser, and make sure that 'Plugins' are enabled. Load https://helpx.adobe.com/flash-player.html .
''How to test'': Make sure you have the [http://get.adobe.com/flashplayer/otherversions/ Adobe Flash PPAPI plugin installed]. Launch DemoBrowser, NanoBrowser, and make sure that 'Plugins' are enabled. Load https://helpx.adobe.com/flash-player.html .


== Fullscreen ==
==Fullscreen==


''Version'': Qt 5.6.0 onwards
''Version'': Qt 5.6.0 onwards
Line 47: Line 47:
''Description'': Support for viewing content in fullscreen mode.
''Description'': Support for viewing content in fullscreen mode.


''Documentation'': n/a
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#fullscreen Fullscreen API support]


''How to test'': Use either demobrowser or quicknanobrowser, go to [http://youtube.com youtube.com] and pick any video, and click on the full screen icon to go into fullscreen mode.
''How to test'': Use either specialized videoplayer<ref>https://doc.qt.io/qt-5/qtwebengine-webenginewidgets-videoplayer-example.html</ref> example or just quicknanobrowser<ref name=":1" /> and go to [http://youtube.com youtube.com] or [https://vimeo.com/ vimeo.com] and pick any video. Click on the full screen icon to go into fullscreen mode.


== Drag & Drop ==
==Drag & Drop==


''Version'': Qt 5.7.0 onwards
''Version'': Qt 5.7.0 onwards
Line 57: Line 57:
''Description'': Support for HTML5 drag and drop.
''Description'': Support for HTML5 drag and drop.


''Documentation'': n/a
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#drag-and-drop Drag and Drop support]


''How to test'': Try any HTML5 drag and drop demo. E.g. [http://html5demos.com/drag this], [http://html5demos.com/drag-anything that] or maybe even [http://html5demos.com/dnd-upload yon]. [http://html5demos.com/file-api Dragging files into the browser] is not part of HTML5 but also works.
''How to test'': Try any HTML5 drag and drop demo. E.g. [http://html5demos.com/drag this], [http://html5demos.com/drag-anything that] or maybe even [http://html5demos.com/dnd-upload yon], or [https://www.w3schools.com/html/html5_draganddrop.asp w3schools one]. [http://html5demos.com/file-api Dragging files into the browser] is not part of HTML5 but also works. Try also to invoke context menu of simplebrowser<ref name=":0" /> or quicknanobrowser<ref name=":1" /> and click 'Save page', which will land an offline copy of a page into default downloads directory. Then just drag this file back to browser from a system file explorer. That should open an offline page through file url.


== Printing to PDF ==
==Printing to PDF==


''Version'': Qt 5.7.0 onwards
''Version'': Qt 5.7.0 onwards
Line 67: Line 67:
''Description'': Support for printing a web page to a PDF file.
''Description'': Support for printing a web page to a PDF file.


''Documentation'': n/a
''Documentation'': [https://doc.qt.io/qt-5/qtwebengine-features.html#print-to-pdf Print to PDF file]


''How to test'': Using demobrowser, access the menu and choose: File -> Print to PDF.
''How to test'': Use html2pdf<ref>https://doc.qt.io/qt-5/qtwebengine-webenginewidgets-html2pdf-example.html</ref> and printme<ref>https://doc.qt.io/qt-5/qtwebengine-webenginewidgets-printme-example.html</ref> examples to test the feature.


== HTML5 DRM video ==
==HTML5 DRM video==


DRM Protected, widevine plugin
DRM Protected, widevine plugin
Line 79: Line 79:
''Description'': Support for viewing DRM protected videos.
''Description'': Support for viewing DRM protected videos.


''Documentation'': n/a
''How to test'': QtWebEngine should be built with proprietary codecs enabled (pass '-proprietary-codecs' to configure when building qt).  Try and view videos at. e.g. http://demo.castlabs.com/, http://ssdemo04.swankmp.net/ or https://shaka-player-demo.appspot.com/demo/.


''How to test'': QtWebEngine should be built with proprietary codecs enabled (pass '-proprietary-codecs' to configure when building qt).  Try and view videos at. e.g. [http://demo.castlabs.com/ http://demo.castlabs.com/], [http://ssdemo04.swankmp.net/ http://ssdemo04.swankmp.net/] or [https://shaka-player-demo.appspot.com/demo/ https://shaka-player-demo.appspot.com/demo/].
==Local Storage==


== Local Storage ==
''Description'': Support for HTML5 local storage.
 
''How to test'': It seems currently there are only auto-tests in qtwebengine/tests/auto/widgets/qwebenginepage, and no manual tests or examples.


''Version'': ???
==WebGL==


''Description'': Support for HTML5 local storage.
''Description'': Support for HTML 5 WebGL
 
''How to test'': Visit http://webglsamples.org/ or https://threejs.org/examples/ and try available demos.
 
==WebSockets==


''Documentation'': n/a
''Description'': Support for HTML 5 WebSockets


''How to test'': It seems currently there are only auto-tests in qtwebengine/tests/auto/widgets/qwebenginepage, and no manual tests or examples.
''How to test'': Try simple online test echo server https://www.websocket.org/echo.html

Revision as of 18:46, 17 February 2021

(Incomplete) list of WebEngine features, and how to test for them. Actively maintained list is available on a dedicated documentation page: Qt WebEngine Features

Chromium DevTools

Version: Qt 5.4.0 onwards

Description: Ability to inspect and debug layout and performance issues of any web content.

Documentation: Qt WebEngine Developer Tools and Debugging with WebEngine

How to test: Launch a QtWebEngine app with command line option --remote-debugging-port=[your-port] and use any QtWebEngine-based example browser (from the same version) instance to connect to http://localhost:[your-port]. See documentation for details. Also, widgets' based simplebrowser[1] and quicknanobrowser[2] examples implement opening devtools in a separate view through context menu.

WebRTC

Version: Qt 5.4.0 onwards

Description: Real-Time Communications (RTC) capabilities via simple APIs

Documentation: WebRTC usage

How to test: Set up a webcam / microphone. Open e.g. https://test.webrtc.org/ in simplebrowser[1] for simple test of supported capabilities. Also https://www.webrtc-experiment.com/RecordRTC/ is good to just test screen recording.

HTML5 Geolocation

Version: Qt 5.5.0 onwards

Description: Javascript Geolocation API with QtLocation as a backend

Documentation: HTML5 Geolocation

How to test: QtLocation should be built before QtWebEngine. Using simplebrowser[1], go to http://html5demos.com/geo, and allow the page to find your position. Note that on Windows you need an external GPS receiver connected, see QtPositioning documentation.

PPAPI / Adobe Flash

Version: Qt 5.6.0 onwards

Description: Support for PPAPI plugins, and Flash in particular

Documentation: Pepper Flash Player Plugin Support and Pepper Flash Player Plugin Support

How to test: Make sure you have the Adobe Flash PPAPI plugin installed. Launch DemoBrowser, NanoBrowser, and make sure that 'Plugins' are enabled. Load https://helpx.adobe.com/flash-player.html .

Fullscreen

Version: Qt 5.6.0 onwards

Description: Support for viewing content in fullscreen mode.

Documentation: Fullscreen API support

How to test: Use either specialized videoplayer[3] example or just quicknanobrowser[2] and go to youtube.com or vimeo.com and pick any video. Click on the full screen icon to go into fullscreen mode.

Drag & Drop

Version: Qt 5.7.0 onwards

Description: Support for HTML5 drag and drop.

Documentation: Drag and Drop support

How to test: Try any HTML5 drag and drop demo. E.g. this, that or maybe even yon, or w3schools one. Dragging files into the browser is not part of HTML5 but also works. Try also to invoke context menu of simplebrowser[1] or quicknanobrowser[2] and click 'Save page', which will land an offline copy of a page into default downloads directory. Then just drag this file back to browser from a system file explorer. That should open an offline page through file url.

Printing to PDF

Version: Qt 5.7.0 onwards

Description: Support for printing a web page to a PDF file.

Documentation: Print to PDF file

How to test: Use html2pdf[4] and printme[5] examples to test the feature.

HTML5 DRM video

DRM Protected, widevine plugin

Version: Qt 5.7.0 onwards

Description: Support for viewing DRM protected videos.

How to test: QtWebEngine should be built with proprietary codecs enabled (pass '-proprietary-codecs' to configure when building qt). Try and view videos at. e.g. http://demo.castlabs.com/, http://ssdemo04.swankmp.net/ or https://shaka-player-demo.appspot.com/demo/.

Local Storage

Description: Support for HTML5 local storage.

How to test: It seems currently there are only auto-tests in qtwebengine/tests/auto/widgets/qwebenginepage, and no manual tests or examples.

WebGL

Description: Support for HTML 5 WebGL

How to test: Visit http://webglsamples.org/ or https://threejs.org/examples/ and try available demos.

WebSockets

Description: Support for HTML 5 WebSockets

How to test: Try simple online test echo server https://www.websocket.org/echo.html