Bug Report: wrong z-index for popup message "WaniKani is looking for the on'yomi reading"

[est_fills_cando]

During reviews, if one enters the kun’yomi reading when WaniKani wants the on’yomi reading, it displays the message “WaniKani is looking for the on’yomi reading.” Recently this message has started displaying with the wrong z-index, causing it to render below the buttons and get cut off. (See picture below.)

It looks like you guys attempted to fix this by setting the z-index of #answer-exception to 1000. However, this does not work because the buttons are in a different stacking context compared to #answer-exception. In order to fix this, you need to change the z-index of an ancestor of #answer-exception that is in the same stacking context as an ancestor of the buttons. For example, changing the z-index of #question from 10 to 11 fixes this without causing any obvious problems.

Reference: MDN article.

Picture Illustrating Bug:

[NicoleIsEnough]

These forums are not actively monitored by the staff afaik, so it would be best to ping @viet I guess.

[alo]

Shoot an email to hello@wanikani.com

They’re pretty responsive.

[Mirella]

I get the same bug, but I’m glad that someone already reported!

[arlo]

Thanks for reporting this @est_fills_cando and @Mirella We’ll be looking into this further.

[est_fills_cando]

In the meantime, here is a userscript which fixes it in reviews

// ==UserScript==
// @name         WK Fix z-Index
// @namespace    eth_fills_cando
// @version      0.1
// @description  miscellaneous bug fixes to WaniKani
// @author       est_fills_cando
// @match        https://www.wanikani.com/*
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';
    let path = (new URL(document.URL)).pathname;

    if (path.startsWith('/review/session')) {
        GM_addStyle('* #question {' +
                    '  z-index: 11;' +
                    '}'
                   );
    }
})();

[ekg]

I’ve also had two examples of this bug.

This morning I managed to remember to take a screenshot of my console.

I don’t know how to read this stuff, but my spontaneous thought was that it was due to the Confetti-script as the bug manifested on a burn item. (thankfully I got 知 sent to durtle heaven later! ^^)

I hope this helps you with identifying the problem!

(it also matches the timeline for me also, as I’ve never seen this bug before, but rather recently I installed that script)

[Saida]

I don’t have that script, but I do have the bug.

[ekg]

Interesting…and good, as I like the rains of confetti upon burning items!

Still, a mystery when it appeared as it’s not that common for me to type the wrong type of reading. It feels recent, but who knows? ^^;

[est_fills_cando]

I made sure to completely disable user scripts when I tested, so it is not user script related.

[ekg]

Well, I wasn’t so much testing, as just reviewing as normal. It’s good that the WK team now know of the issue. ^^

[est_fills_cando]

Sorry, I didn’t mean that to sound like a criticism. I just wanted to make sure the WK team knows it’s not script related.

[ekg]

I really don’t know much about this stuff. But does the console show anything worthwhile?

[est_fills_cando]

I don’t see anything obvious in the console that would be related. The console mainly shows javascript related stuff, whereas the immediate cause of this issue is what they set the z-index property to in CSS. It’s possible to actually see the CSS that causes the issue by going through the stuff related to the buttons and popup in the inspector tab.

[ekg]

I see. Good thing more knowledgeable people than me are working on this issue!

[est_fills_cando]

I made sure to completely disable user scripts when I tested, so it is not user script related.

I’m also posting this as a direct reply to @arlo’s comment to make sure he sees that the issue still occurs with all userscripts completely disabled, in case he only gets notifications when his comment is replied to directly.

[JenK]

Sorry for the delay! It looks like our engineer fixed it the other week. Let us know if you’re still seeing this bug though!

[est_fills_cando]

Looks fixed on my end too
Thanks!