[webkit-gtk] rendering a webpage to SVG

[Ivan Klimek]

Dear webkit-gtk developers,

I am trying to render a webpage to SVG, I am successful in doing so using
Qt webkit - but as you all know Qt webkit has been discontinued thus I am
trying to migrate my code to webkit GTK

the problem I am facing is that the generated SVG is only a wrapped PNG
image of the rendered webpage, on Qt the webpage is rendered "all vector"
texts etc all is "vectorized" an example of using this approach are apps
like: http://cutycapt.sourceforge.net/ or https://wkhtmltopdf.org/

my code is as follows (parts omitted for brevity):

g_signal_connect(main_window, "damage-event", G_CALLBACK(capture),
main_window);

static gboolean capture(GtkWidget *widget, GdkEvent *event, gpointer
user_data)
{

  fprintf(stderr, "damage event callback called..\n");

  cairo_surface_t *surface =
gtk_offscreen_window_get_surface(GTK_OFFSCREEN_WINDOW(user_data));

  cairo_set_source_surface(ctx, surface, 0, 0);
  cairo_paint(ctx);

  char filename[100];
  sprintf(filename, "%03i.svg", counter);
  counter = counter + 1;

  svg(filename, user_data, widget);

  return TRUE;
}

void svg(const gchar* filename, gpointer user_data, GtkWidget *widget)
{
  cairo_surface_t *surface;
  cairo_t *cr;

  surface = cairo_svg_surface_create(filename, 800, 600);
  cr = cairo_create(surface);

  gtk_widget_draw(GTK_WIDGET(user_data), cr);

  cairo_surface_destroy(surface);
  cairo_destroy(cr);

  return;
}

sample output file attached (webkitGTK_generated.svg)

it's just a wrapped png:

cat  webkitGTK_generated.svg | more
<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="
http://www.w3.org/1999/xlink" width="800pt" height="600pt" viewBox="0 0 800
600" version="1.1">
<defs>
<image id="image407" width="3334" height="2500"
xlink:href="data:image/png;base64,iVBORw0KGgoAA.....


as an example what I mean by "vectorized" SVG is attached
(qt_webkit_generated.svg)

generated using Qt webkit using following command:

wkhtmltoimage --width 800 --height 600 --javascript-delay 1000
https://codepen.io/jasonleewilson/full/gPrxwX qt_webkit_generated.svg

cat qt_webkit_generated.svg | more
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="282.222mm" height="211.667mm"
 viewBox="0 0 800 600"
 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="
http://www.w3.org/1999/xlink"  version="1.2" baseProfile="tiny">
<title>Qt SVG Document</title>
<desc>Generated with Qt</desc>
<defs>
</defs>
<g fill="none" stroke="black" stroke-width="1" fill-rule="evenodd"
stroke-linecap="square" stroke-linejoin="bevel" >

<g fill="#ffffff" fill-opacity="1" stroke="none"
transform="matrix(1,0,0,1,0,0)"
font-family="DejaVu Sans" font-size="12" font-weight="400"
font-style="normal"
>
<rect x="0" y="0" width="800" height="600"/>
</g>

<g fill="#000000" fill-opacity="1" stroke="#000000" stroke-opacity="1"
stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"
stroke-miterlimit="2" transform="matrix(1,0,0,1,0,0)"
font-family="DejaVu Sans" font-size="12" font-weight="400"
font-style="normal"
>
</g>

<g fill="#000000" fill-opacity="1" stroke="#000000" stroke-opacity="1"
stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"
stroke-miterlimit="2" transform="matrix(1,0,0,1,0,0)"
font-family="DejaVu Sans" font-size="12" font-weight="400"
font-style="normal"
>
</g>

<g fill="#000000" fill-opacity="1" stroke="#000000" stroke-opacity="1"
stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter"
stroke-miterlimit="2" transform="matrix(1,0,0,1,0,0)"
font-family="DejaVu Sans" font-size="12" font-weight="400"
font-style="normal"

....


*is it possible to generate SVG renders in webkit-GTK that would not be
just wrapped PNG images? something similar to what Qt webkit is able to
render? *


Thank you!
Ivan
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-gtk/attachments/20200820/052602ab/attachment-0001.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: webkitGTK_generated.svg
Type: image/svg+xml
Size: 625553 bytes
Desc: not available
URL: <http://lists.webkit.org/pipermail/webkit-gtk/attachments/20200820/052602ab/attachment-0002.svg>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: qt_webkit_generated.svg
Type: image/svg+xml
Size: 42292 bytes
Desc: not available
URL: <http://lists.webkit.org/pipermail/webkit-gtk/attachments/20200820/052602ab/attachment-0003.svg>