Change Details

The Skin.js code contains code with the responsibility of lazy loading images and references. It currently does this with little testing and by emitting and watching for events on an eventBus that is passed into it as a parameter. = Acceptance criteria [X] We will refactor code so that the Skin makes use of 2 tightly scoped modules that add lazy loading images and lazy loading references capabilities. [] We will add test coverage for the Skin class [X] We will add tests coverage for newly created lazyReferencesLoader.js and lazyImagesLoader.js code. [] We will remove usages of jQuery in the codebase = QA steps [] Go to an article on a mobile device with images. [] Disable internet browser connection to verify that images in sections are not loaded by default [] Enable internet browser connection and notice how images load as you scroll to or open the sections. [] Opt into beta. [] Find an article with references and notice how the references do not load with the internet connection disabled [] Enable internet and confirm references load If any of the above does not hold true please report it and move this card to needs more work.

The Skin.js code contains code with the responsibility of lazy loading images and references. It currently does this with little testing and by emitting and watching for events on an eventBus that is passed into it as a parameter. = Acceptance criteria [X] We will refactor code so that the Skin makes use of 2 tightly scoped modules that add lazy loading images and lazy loading references capabilities. [x] We will add test coverage for the Skin class We added tests for the lazyImageLoader which used to be part of the Skin class (https://gerrit.wikimedia.org/r/486372) [X] We will add tests coverage for newly created lazyReferencesLoader.js and lazyImagesLoader.js code. [x] We will remove usages of jQuery in the codebase Per T214658#4952285 = QA steps [] Go to an article on a mobile device with images. [] Disable internet browser connection to verify that images in sections are not loaded by default [] Enable internet browser connection and notice how images load as you scroll to or open the sections. [] Opt into beta. [] Find an article with references and notice how the references do not load with the internet connection disabled [] Enable internet and confirm references load If any of the above does not hold true please report it and move this card to needs more work.

The Skin.js code contains code with the responsibility of lazy loading images and references. It currently does this with little testing and by emitting and watching for events on an eventBus that is passed into it as a parameter. = Acceptance criteria [X] We will refactor code so that the Skin makes use of 2 tightly scoped modules that add lazy loading images and lazy loading references capabilities. [x] We will add test coverage for the Skin class We added tests for the lazyImageLoader which used to be part of the Skin class (https://gerrit.wikimedia.org/r/486372) [X] We will add tests coverage for newly created lazyReferencesLoader.js and lazyImagesLoader.js code. [x] We will remove usages of jQuery in the codebase Per T214658#4952285 = QA steps [] Go to an article on a mobile device with images. [] Disable internet browser connection to verify that images in sections are not loaded by default [] Enable internet browser connection and notice how images load as you scroll to or open the sections. [] Opt into beta. [] Find an article with references and notice how the references do not load with the internet connection disabled [] Enable internet and confirm references load If any of the above does not hold true please report it and move this card to needs more work.