Hints doesn't work on Archlinux Security page.

[0a-a]

Steps to reproduce

1. Open the site https://security.archlinux.org/
2. Trigger any hints (f, ;x, ;o, etc)

Expected behaviour

Elements get highlighted and the keyhints show up
Highlight work, but no keyhints show up.

Actual behaviour

$ vimb --bug-info
Commit:          3.3.0-3-g502b49a
WebKit compile:  2.22.2
WebKit run:      2.22.2
GTK compile:     3.24.1
GTK run:         3.24.1
libsoup compile: 2.64.2
libsoup run:     2.64.2
Extension dir:   /usr/lib/vimb

Was the same with vimb version 3.2.

[fanglingsu]

@0a-a Thank you for reporting this issue. I can reproduce this. The hint-labels are kept as display: none, the default value when they are created. I assume that this is related to the error in the webinspector "Refused to apply a stylesheet because its hash, its nonce, or 'unsafe-inline' does not appear in the style-src directive of the Content Security Policy.".
So that the Stylechanges of vimb could not be applied to the hinted elements or hint labels because the inline styles are not evaluated. We could remove the disaply:none part, but the inline set positions for the labels would also by denied. I'm note sure if there is a a working solution for this issue. Maybe we could do some shadow-DOM stuff to create the hintlabels.

[0a-a]

Seams that there's same or similar issue with https://pypi.org

[fanglingsu]

Yes, this seems to be the same issue with the Content-Security-Policy.

The issue can be checked also by opening webinspector and running some JS
that creates elements with inline styles.

:e! document.body.innerHTML += '<div
style="position:absolute;width:100px;height:100px;z-index:100;background:#f00;left:0;top:0;">FOO</div>';

There is shown an error in webinspector like "Refused to apply a stylesheet
because its hash, its nonce, or 'unsafe-inline' does not appear in the
style-src directive of the Content Security Policy." and the element is not
styled right.

[fanglingsu]

I don't think we can do anything to bypass this securoty mechanism. OK we could, by removing the CSP headers before they are processed by webkit. But I don't want to remove this extra pice of security.
I've checked if it would be possible to style shadow DOM nodes, but this is also not allowed.

[fanglingsu]

I've change the JS logik to consequently use the elements style object to position and style them instead of the style attribute. I thought both where only two ways to make the same, but they are different, like we can see now.