Debugging: How to find where mystery divs are coming from

I recently installed and then uninstalled the aria-modal-dialog npm package. Somehow my code is now generating three 0px by 0px divs and inserting them above the header, which is throwing off the layout, and I'm having a heck of a time finding where they're coming from. GH: https://github.com/nnall/DevJobs-FEM.git Live: https://main--dynamic-salmiakki-7aaccb.netlify.app/
GitHub
GitHub - nnall/DevJobs-FEM
Contribute to nnall/DevJobs-FEM development by creating an account on GitHub.
30 Replies
Jochem
Jochem2y ago
the last one contains references to the icons used for your dark mode toggle
Jochem
Jochem2y ago
it's probable these three?
thethingisback
yea they're the template-included sprites from 11ty.. when I instaleld aria-modal-dialog package , there were some 'moderate severity' errors it was having with 11ty, that I 'force' fixed, so I'm just gonna uninstall and reinstall 11ty now i think
thethingisback
well it looks liek even uninstalling them, I'm still getting these "3 moderate severity venerabilities" in the terminal
Jochem
Jochem2y ago
welcome to npm you'll have to evaluate each, and either mitigate them in your own code, or decide you can't use the package until the vulnerabilities are fixed
thethingisback
darn, it was all working before I installed that aria-modal-dialog package the npm audit fix is pretty useless i guess?
Jochem
Jochem2y ago
roll back to a commit before you installed it, delete node_modules and reinstall? it's really not, it just can't fix everything. Sometimes it'll try to find other versions that still fit your dependencies, and sometimes that works, but a lot of the time the advisories will cover a lot of older versions and there's no resolution to your dependency tree that doesn't include the vulnerability it's a really, really strong argument to use as few packages as possible, and only use well maintained ones
thethingisback
right, the aria one is pretty old ok, yea, i'll go back to a pre-install commit then
Jochem
Jochem2y ago
remember your node_modules isn't in your repo, so you'll have to run npm install or potentially even remove it and then run npm install
thethingisback
gotcha okay
thethingisback
could not revert?
Jochem
Jochem2y ago
it'll have edited index.njk to mark the conflict. manually edit it and follow the "after resolving" instructions make sure you resolve all the marked conflicts, there might be multiple
thethingisback
so i used the resolve conflicts editor in vsc, went through all of the file differences and chose the version I wanted, and then after merging the changes into the one I want, VSC presented a "Commit" button in order to commit the changes directly, which I clicked, and now I'm seeing what looks to be a loading screen with a little dash that keeps flashing across the top
Jochem
Jochem2y ago
check the git console
thethingisback
Nothing changed there, still just same conflict message I got initially
thethingisback
oh wait scratch that, there's more I need to do
thethingisback
I'm still seeing this other section of package.json and package-lock.json changes, though its not giving me an the option to open the 'resolve conflicts editor'
Jochem
Jochem2y ago
what does git status say?
thethingisback
ahh
thethingisback
i guess that's the last step
Jochem
Jochem2y ago
well, the diff is probably showing you what changed since the last commit if you just commit the changes you have now, it's probably fine?
thethingisback
i think so.. It looks like so much I think because uninstalled 11ty and one of its plugins
thethingisback
so trying to uninstall node, I've gone into my 'local' on my mac, and removed node from 'bin', 'include', and 'lib'. but when I check node -v, i'm still getting a version. Is there somewhere else I need to delete it?
thethingisback
I ran the sudo rm -rf node command when I removed them
Jochem
Jochem2y ago
make a new thread for that please, #os-and-tools for stuff like this. Also I have no idea about uninstalling node, I just use nvm and let that handle it all. also do not know how to set that up properly, I just google and follow the instructions
thethingisback
gotcha ok thank you too btw Welp, just got done uninstalling and reinstalling node, npm. I Go to install my 11ty sprite dependency again, the one that kept giving me that 3 “moderate severity” errors message. And I go to install it again and again I get the same 3 moderate errors message
Jochem
Jochem2y ago
they're not a mistake you're making, those are security warnings because you're using a package with security issues
thethingisback
everything's working again, no more extra divs from the sprite inclusions.. I need to now 1. make sure my forms are aria-compliant, and 2. figure out how to go about actually using them as forms, in order to search my .json and populate my cards. Do you know of a good tutorial or information on how to do 2?
Jochem
Jochem2y ago
No, sorry
Want results from more Discord servers?
Add your server