Hello there!
I tried to open the information panel about a card today, but although the window appeared, no information were displayed inside.
I’m using the latest version of Anki but I’m using the older Qt for compatibility reasons.
Here is the log from the terminal when I open the information panel : JS error /_app/immutable/nodes/2.BQOQa5U9.mjs:1 Uncaught (in promise) TypeError: s.toReversed is not a function
And here is what I see when I open the information panel.
Any clue ?
Going out on a limb here, but I suspect toReversed is actually Array.prototype.toReversed(), which is only supported from chromium 110 onwards
According to QtWebEngine/ChromiumVersions - Qt Wiki, the chromium bundled with qt5 is, for lack of a better word, ancient (<88)
And given Consider dropping the Qt5 builds · Issue #3615 · ankitects/anki, I highly doubt it’s going to be looked into.
What reasons, if I may ask? I understand intel mac users are hesitant to update and lose out on tabs. But if it isn’t anything important, you should consider using qt6
The qt5 version has multiple problems that I reported here earlier:
Dae (one of ankis official developers) said the following though:
Given #3615, I don’t think it’s worth trying to fix these issues. But if someone felt like looking into it, and the changes were simple, I’d still consider accepting a PR.
Not sure if this is still dae’s view though, since qt5 builds have been dropped from the website and manual since then.
Just did testing, demonstrated that this line maps to s.toReversed().forEach(...) when built and run
Seems like a simple fix, but I’m not sure if that alone would fix it, that there isn’t another missing function to fix
Because of tabs essentially yes. and sometimes I got some conflict with other pieces of software so I prefer to stay with qt5 for now.
thank you for your help!
What I can tell from my user’s perspective is that it worked well before (I’m so sorry I couldn’t tell when it started being buggy)
So any clue how to fix this issue?
Finally figured out how to build and test on qt5 
, was able to confirm that the fix was sufficient and opened a pr
@Anon_0000 I wasn’t able to fix the simulator chart area being shown as black unfortunately, qt5 is doing something weird with svelte/css and the styling’s not showing up for some reason
If Qt5 is using a really old version of chromium it could just be that svelte is using JS/CSS that is too new for Qt5 to understand.
The Vite documentation says:
Note that by default, Vite only handles syntax transforms and does not cover polyfills.
The esbuild documentation says:
This sets the target environment for the generated JavaScript and/or CSS code.
[…]
Note that this is only concerned with syntax features, not APIs. It does not automatically add polyfills for new APIs that are not used by these environments. You will have to explicitly import polyfills for the APIs you need (e.g. by importing
core-js). Automatic polyfill injection is outside of esbuild’s scope.
Yep, already said in an earlier reply that qt5 chromium versions are <88.
The css issue is that the simulator’s <rect> has a class svelte-1u4akxr, which seems to have magically disappeared from the output bundle
But in fact it’s present in HoverColumns.C6LhRLLa.css:
.no-data.svelte-1u4akxr rect:where(.svelte-1u4akxr){fill:var(--canvas-elevated)}.no-data.svelte-1u4akxr text:where(.svelte-1u4akxr){text-anchor:middle;fill:gray}
Wherein lies the issue: the :where() selector isn’t supported by qt5.
If you really want to save the Qt5 version it might be worth trying things like babel and postcss-preset-env rather than trying to fix things by hand.
I assume there will be more and more issues as the expected baseline becomes newer over time.
I don’t, it’s just that I happened to stumble upon this, and leaving it unfixed when there’s a solution (not an ideal one like a transpiler) seems wasteful
It’s almost certain that there aren’t going to be any more qt5 builds. So I’m not sure if that’s a good use of time
chrome77 is already listed as a target in esbuild and yet it’s generating css syntax (:where) and js (toReversed) that isn’t supported by it
I assume it is because CSS pseudo-classes in general are syntax, but the behaviour of the specific pseudo-class :where is functionality. The rest of the quote suggests they do not try to polyfill any missing functionality.
TIL if that’s the case
Well, if you manage to add in babel or tweak the preprocessor step to make it work, do contribute it so qt5 users can benefit. Was going to open a pr for the simulator chart bug, but will hold off on it. Not really interested in the intricacies of ts/js to explore further
I’m not planning to do it myself as I’m happy with the Qt6 version and it doesn’t seem to have any of that kind of problem at the moment.
I was just trying to say that if you were looking to save the Qt5 version it might be easier to set up automated tools than attempting to manually fix all the problems yourself.
It isn’t for me, unfortunately, at my current knowledge level and amount of free time. A 2-line fix for the card info dialog seems sufficient for now. If another functional (not visual) bug pops up, perhaps then it’d warrant adding an extra build step I guess.
Ultimately it depends on dae’s definition of “simple changes”
Just for your information, there are other functional breakages as well, like this one:
There might be even more in the qt5 related codebase.
Yep, became aware of this while fixing a related feature. Left it untouched, as I couldn’t find a solution that worked in qt5 (other than to disable it entirely if qt5).
That’s a python bug that won’t be fixed by what @rossgb suggested. Such bugs have to be found and fixed manually, unless I’m mistaken.
