Update WebKitGTK to 2.20.5

[bauerj]

This updates the included WebKitGTK version from 2.4.10 (released 2016-03-14) to 2.20.5 (released 2018-08-13).

Newer is not always better but a lot has changed in the web in the last 4 years. For example, xibo-linux now supports flexboxes in HTML layouts which previously didn't work properly. Arguably the new version is not exactly "state of the art" either. When Ubuntu 20.04 is released, the snap base should be changed accordingly to pull in an even newer version.

The API has changed a bit but luckily the changes in this project are marginal.

[dasgarner]

Fantastic - thanks very much.

@Stivius I've requested a review from you please, when you have time.

[Stivius]

@bauerj thanks for this PR!
However, we've discussed that before and I've already tested 2.20.5 with webkit_web_view_set_background_color call. Unfortunately, it doesn't behave the same as webkit_web_view_set_transparent in 2.4.11. For instance, if you put a transparent web view widget
above the video and image it will erase the other content as well:

What we can do is ask them to implement similar functionality in the upcoming release.

[dasgarner]

@Stivius - you're right of course, sorry I forgot about this point!

Did we raise an issue in the WebKitGTK project for this?

I will forget again unless we have it written down, so I have opened an issue for it and linked to this PR.

[bauerj]

Indeed, this seems to be a regression in WebKitGTK. From reading the docs I assume this use-case should be possible but testing confirmed that it doesn't work.

Did you test this with a different version of WebKitGTK? Maybe the bug was already solved.

[Stivius]

@bauerj I've tested with 2.28 which seems to be the latest release. So I think we need to create an issue on their tracker.

[bauerj]

Yes, please do.

I'm curious if you were able to build the webkitgtk "minibrowser" executable. It seems to have a command line option for the background color, so if it shows the same behaviour it would probably be a lot easier for them to reproduce this issue.

[bauerj]

@Stivius any updates? Did you create an issue on their bug tracker? If so, can you link it here?

[dasgarner]

@Stivius - can we confirm whether or not this happened?

Did we raise an issue in the WebKitGTK project for this?

Thanks!

[jthartika]

For what it's worth, I have successfully built R5 with Webkit2Gtk upgraded to version 2.26.4. Although the docker build does run into linking errors (undefined reference) related to Webkit2Gtk unless one specifies the webkit2gtk dependency in the player/control/media/CMakeLists.txt instead of the player root folder's CMakeLists.txt.

I spent several days figuring this out as I'm unfamiliar with CMake.

[bauerj]

Does successfully mean you didn't run into the transparency bug?

[jthartika]

Does successfully mean you didn't run into the transparency bug?

I haven't encountered the bug so far as described by Stivius - Ill try if I can reproduce it next week with a test layout.

BTW: there is this bit in the documentation regarding _set_background_color, not sure if its needed for transparency:

"Note that the parent window must have a RGBA visual and “app-paintable” property set to TRUE for backgrounds colors to work." ( Source: https://webkitgtk.org/reference/webkit2gtk/stable/WebKitWebView.html#webkit-web-view-set-background-color )

[dasgarner]

Thank you for both your comments and continued interest in this PR.
Unfortunately from Xibo's side, @Stivius has been busy with other non-Xibo responsibilities so we have not been able to make any progress here.

If you want to test the transparency issue, all you need to do is put some web content on top of an image or video. You will see the web content blocks the content underneath.

If this has been fixed between 2.20.5 and 2.26.4 it would be a fantastic thing and we'd happily accept the contribution!

[jthartika]

Thank you for both your comments and continued interest in this PR.
Unfortunately from Xibo's side, @Stivius has been busy with other non-Xibo responsibilities so we have not been able to make any progress here.

If you want to test the transparency issue, all you need to do is put some web content on top of an image or video. You will see the web content blocks the content underneath.

If this has been fixed between 2.20.5 and 2.26.4 it would be a fantastic thing and we'd happily accept the contribution!

I'll be sure to post my changes if it's indeed working. Didn't have time today at work :)

[jthartika]

Does successfully mean you didn't run into the transparency bug?

Yes, it appears indeed that using WebKit2GTK 2.26.4 at least fixes this. Here's a short demonstration of a PNG file with fully transparent background overlaid over a playing video (https://drive.google.com/file/d/1_Khx6pPqOWCK41FO0FdK1OT0CFWJ1Ykn/view?usp=sharing 30 MiB .mp4)

So I suggest the original author to include that version instead of the older one.

[bauerj]

Sure, I will update this PR to 2.28.4 later. Thanks for testing!

[Stivius]

@bauerj where do you use the webview in your example? You said you put PNG image over video but we need to test some web content as well.

[bauerj]

What example do you mean?

[dasgarner]

Thanks for the updated PR, excited to try this.

Unfortunately this doesn't build with the change to core20 (gnome-3-28 is not supported by core20), and doesn't build with core18 either.

Below is the build error with core18:

-- Checking for module 'webkitgtk-3.0>=2.4.10'
--   No package 'webkitgtk-3.0' found
CMake Error at /usr/share/cmake-3.18/Modules/FindPkgConfig.cmake:545 (message):
  A required package was not found
Call Stack (most recent call first):
  /usr/share/cmake-3.18/Modules/FindPkgConfig.cmake:733 (_pkg_check_modules_internal)
  control/media/CMakeLists.txt:7 (pkg_check_modules)

Below is the build error with core20:

Failed to load extension 'gnome-3-28': this extension does not support the 'core20' base.
Either use a different extension, or use a base supported by this extension.

@bauerj where do you use the webview in your example? You said you put PNG image over video but we need to test some web content as well.

The PNG must be in a browser?

[dasgarner]

What example do you mean?

The example provided by @jthartika shows a PNG image over the top of a Video as a demonstration of the transparency working... however Xibo doesn't show images in a web browser (unless they are embedded with an Embedded/Web Page widget).

I'm very happy to test this if I can get it built - I can then run a variety of different transparency tests to confirm.

[bauerj]

Apologies @dasgarner, this isn't quite ready yet. I don't have a snapcraft environment to test here. Once it builds, I will let you know that it can be tested.

[dasgarner]

Great, thank you very much!

[Stivius]

Let's make sure we are testing the same thing. I've prepared a small example which works fine with 2.4.10 and doesn't work with higher versions. The example consists of an image and webview on top of it. You need to build using CMake and adjust paths for image and .html doc. I've also attached the screenshots.
transparency_test.zip

[Stivius]

I've created the bug report so you can track the status of this issue
https://bugs.webkit.org/show_bug.cgi?id=215119