Sigh.
In case you were wondering how my Saturday morning and early afternoon has gone, it is summed up by this README.md I just had to add to the project for my ongoing blog article series (VueJs/Symfony/Docker/TDD series):
Warning
2021-03-27
Note that in package.json both vue and @vue/compiler-sfc and currently version-limited to exactly 3.0.6. I realise this is less than ideal.
This is because something about later versions (current is 3.0.8 at time of writing) screws up how Vue Test Utils mounts <select> options when the <select> has a v-model (or possibly because the v-model is asynchronously loadedfrom a remote call? Dunno).
This results in "Cannot read property 'length' of undefined" in setSelected in node_modules/@vue/runtime-dom/dist/runtime-dom.esm-bundler.jsruntime-dom.esm-bundler.js when it evaluates el.options.length, when the component is first shallowMount-ed. Around line 2021 in the version of that file I'm looking at.
This is because the options array apparently is not even defined if it's empty (which seems like a bug to me).
That specific code is the same in 3.0.6 as it is in 3.0.8, so it must be some upstream code that's messing it up. I CBA digging into it further.
Note that the component works A-OK in a browser environment, so am guessing Vue itself is not doing anything wrong; it's how the test utils are mounting the component. Although I guess if Vue has changed things so that that options array might not now exist, then that's not so cool.
I'll give it a month or so and try with a more liberal version constraint, to see if it starts working again.
All this happened because I happened to rebuild my NodeJS container from scratch before starting on my next blog article this morning. Dumb-arse.
Oh I also suddendly needed to add global.SVGElement = Element; to the top of my test spec because reasons. Thanks to Testing with react-md for being the only resource I could find explaining the "ReferenceError: SVGElement is not defined" my tests started throwing when I ran them after the rebuild. Fortunately now I'm back on Vue 3.0.6 that error has gone, so I backed-out that change.
All this was after I spent half a day yesterday wondering why npm-installing Vue CLI globally in my Docker container suddenly started to freeze and chew up 50% of my PC's disk and memory resources. Building the same container on a different PC (but still with largely the same environment: Windows, WSL, same version of Docker etc) worked fine. I never worked that one out; I just stopped installing Vue CLI globally and problem went away. Except it started all this other bullshit.
So instead of another article today, I think Docker and VueJS can just get tae fuck. I'm gonna play computer games instead. Something with lots of bullets and explosions (OKOK, it'll be FallOut 4. It's the only shooting game I play).
Fuck sake.
--
Adam
