lozad.js
lozad.js copied to clipboard
Test coverage of responsive <picture> scenarii
Attempting to make a PR to solve #92, I tried to implement a set of tests for responsive images using <picture>
tags.
It's not that easy, because js-dom
(used for tests) doesn't replicate the browser behavior of triggering a src
attribute set in the <img>
tag injected by lozad, according to media queries defined on <source>
elements.
I tried using mq-polyfill
and canvas
or canvas-prebuilt
, with no luck so-far.
- Do you see a way to do that correctly with js-dom ?
- If not, should we / can we use a more heavy approach ? (using an automated headless browser, like pupetteer) ?
What do you think ?
@0gust1 using headless browser for testing of Lozad.js is the right way to move forward
@0gust1 if you can get it working correctly with <picture>
you will be my hero :)
@0gust1 any updates on the test case implementation?
@ApoorvSaxena Hi ! I have locally a "working" prototype with jest and pupeteer. Sorry, didn't had much time (lot of churn at work+family).
Would you accept to remove the pre-commit hook on eslint (and let it for the build, of course) ? It will enable people to push quickly an "imperfect/incomplete" code on a feature branch and working together on it.
Also, the choice of puppeteer is questionable, with it, you can't test issues like this one : https://github.com/ApoorvSaxena/lozad.js/issues/99
@0gust1 with you want to push "imperfect/incomplete" code just add an -n
flag to your commit. Something like: git commit -m "something good but incomplete" -n
. By doing that the git hook is skipped.
@thiamsantos thanks, I forgotten that :)
@ApoorvSaxena here we go : https://github.com/ApoorvSaxena/lozad.js/pull/101
I think, I'll update the PR in next days / next week (I'm on holidays abroad, should have access to net).