[Userscript] Wanikani Item Inspector

I wonder if anyone knows how to get this working on iPad? I’m running other WaniKani userscripts (like Re-Order Omega, Katakana for On’Yomi and Self Study) just fine.

I installed the Open Framework Additional Filters script, and I’ve installed the Kanji Stroke Order Font and verified Safari can use it by trying it on a CodePen.

Yet when I load the Dashboard, I still get the popup saying I have to install the Kanji Stroke Order Font to continue. Is there a trick to tell the script to re-examine its font cache or something?

(Alternatively, is there a way to use other features even without the font?)

Item Inspector relies heavily on mouse over popups. There is no way to get this to work on a tablet because there is no mouse and no mouse over equivalent UI feature.

I see… but iPad Pro has mouse and trackpad compatibility and some sites support hover. It may be impossible on WaniKani if their stylesheets disable hover on mobile.

1 Like

I don’t know about WK stylesheet but if Ipad Pro supports hover it may work with Item Inspector. Please try it and let me know whether it works.

How would I try? As I mentioned the modal telling me to install the font doesn’t let me go farther.

1 Like

This modal gives you two options. One that directs you to the font web site for installing the font, the other ignores the lack of font and lets you proceed to Item Inspector. Have you tried both options?

Item Inspector works fine without the font. You just lack some stroke Order data in some popups. Everything else works as intended. If you want Item Inspector without the font the top post of this thread contains instructions on how to disable the lack of font warning under the heading “What If You Don’t Install the Prerequisites?”.

If you want the font I can’t help you much because I don’t have an iPad. From a google search I have found that Apple wants the fonts to be installed through some App Store provided application. This could be the problem. This page gives a procedure to install fonts without getting them through the App Store.

Thanks for the help!

I fell into a rabbit hole here and have learned the reason I couldn’t use the fonts—but now it makes me wonder how anyone on any Apple device, including a Mac uses it… Anyway, here goes:

Since learning a precise list of extra installed fonts could be used to track someone across websites—so-called “font fingerprinting attacks”—Safari was modified ~6 years ago. (Not specifically mobile WebKit, just, Safari/WebKit.)

Apple changed it to always return true whenever a script asked if a font existed—regardless of whether the font being queried about was installed or not (or even existed or not). It also made it so that if you tried to determine if you could display a particular glyph (kanji, kana, letter, punctuation mark, etc.) with FontSet.check() or similar, you could only ask about a list of fonts—and would always get a return of true when no font listed supported the requested glyph. (Other browsers adopted these privacy measures, and this behavior is what is documented at this moment on MDN.)

So all was well in the world… well, no, of course not. If you had a big database of glyphs and were willing to try every permutation of font list you needed to create a fingerprint, you could still generate one.

So Safari changed it so that it answered true about system-standard fonts and false to all others—installed or not. (The system-standard fonts differed between localizations, so it could still be used to see if someone had any font capable of displaying Japanese or not.)

Then, the next attack came in the form of malware sites creating long lists of fallback fonts in every possible permutation, displaying text in a block element with those lists, and then inspecting what size the element rendered was, which if chosen correctly could again get you the list of installed fonts—and voilà, font fingerprinting was back!

So now, Safari will only use system-standard fonts and remotely-served webfonts. (I guess that explains why, if you’ve bought any webfonts from Adobe lately, you don’t even get the option of downloading them in TrueType/OpenType format anymore.)

On a Mac, there’s a defaults key you can change to allow the old behavior and make local fonts available to webpages again; and apparently, if you upgraded into a current macOS with custom fonts that Safari could use already installed, you got grandfathered in. So maybe the set of Mac users who had never installed a font before this restriction was put in place is relatively small? I dunno. Otherwise, I can’t explain why Mac users aren’t complaining all over this and other KSOF threads for the past couple years. (And indeed, checking my Mac, that font-fingerprinting checker I linked to above can see my Japanese fonts I’d installed years back—but not KSOF.)

Anyway, end of rabbit-hole—since userscripts so often rely on local font tricks, I figured it was worth documenting what I found over the past several hours.

I wish I had an answer, besides “use free webfonts, not locally-installed fonts”, since It seems this is supposed to soon be the default behavior on Windows and other cross-platform browsers, too? But a heads-up that this will soon be trouble seems worthwhile… ¯_(ツ)_/¯

4 Likes

That was a wonderful story

1 Like

Interesting story. I wonder how it effects Item Inspector. I surmise that Safari lets you install the font. It just messes with the font detection call. But Item Inspector does not use this to detect the font. It writes some test text in a canvas twice.

  • Once with the stroke order font with a fallback font for use when the stroke order font is absent.
  • Once with the fallback font alone.

Item Inspector compares the size (in pixels) of the space occupied by the two texts in the canvas. If they are different then the stroke order font is present because different fonts were used. If the sizes are the same then the stroke order font is absent because the same font was used twice.

I also wonder. Can you hover over the items and reveal the popups in a iPad pro?

I haven’t seen screenshots so I’m not 100% sure which userscript is doing this:

Is this Item Inspector?

But also the Ultimate Timeline has hovers that work:

I’m totally befuddled as to why some hovers work perfectly and others don’t trigger at all.

Ah—I just realized I had Item Inspector disabled because I was tired of the KSOF warning, so both screenshots come from other sources. Turning it back on, I don’t see anything, but I’m still not sure what, exactly, I should hover on.

Try hovering over the items in the table. The top post of this thread has screenshots.

Do you or anyone you know have an in with the KSOF creator/maintainer? If it could get uploaded to a web font repository like Google Fonts, this issue would just go away…

1 Like

I don’t have have an in with the KSOF maintainer.

This page gives a procedure to install fonts without getting them through the App Store. It relies on an font installer app. Do you see any reason it wouldn’t work?

I use FontCase to install apps just fine—I’m using KSOF already in my notes app.

The issue is that while you can use them in local apps (even WebKit-based apps, like Electron-ported apps), you can’t use them in Safari/WebKit (or any other browser, I’d guess, since Apple doesn’t allow other webpage renderers on their devices, so Chrome, etc., are skins over the same WebKit as Safari).

1 Like