Skip to content

Commit

Permalink
Add disableMutationObserver setting
Browse files Browse the repository at this point in the history
  • Loading branch information
michalsnik committed Oct 3, 2018
1 parent 2f62a4d commit 7c55654
Show file tree
Hide file tree
Showing 4 changed files with 26 additions and 6 deletions.
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,7 @@ AOS.init({
initClassName: 'aos-init', // class applied after initialization
animatedClassName: 'aos-animate', // class applied on animation
useClassNames: false, // if true, will add content of `data-aos` as classes on scroll
disableMutationObserver: false, // disables automatic mutations' detections (advanced)

// Settings that can be overridden on per-element basis, by `data-aos-*` attributes:
offset: 120, // offset (in px) from the original trigger point
Expand Down
19 changes: 19 additions & 0 deletions cypress/integration/settings_disableMutationObserver_spec.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
describe('setting: disableMutationObserver', function() {
before(() => {
cy.visit('/async.html');
cy.initAOS({
disableMutationObserver: true
});
});

it('Should not detect any changes in DOM, and thus not animate any elements as a result', function() {
cy.dispatchEvent('add-aos-item', 20);
cy.get('.aos-item').should('have.length', 20);
cy.get('.aos-animate').should('have.length', 0);
});

it('Should not animate dynamically loaded elements on scroll', function() {
cy.scrollTo('bottom');
cy.get('.aos-animate').should('have.length', 0);
});
});
5 changes: 1 addition & 4 deletions demo/async.html
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,8 @@

<script src="dist/aos.js"></script>
<script>
AOS.init({
easing: 'ease-in-out-sine'
});

if (!window.Cypress) {
AOS.init();
setInterval(addItem, 150);
} else {
document.addEventListener('add-aos-item', addItem);
Expand Down
7 changes: 5 additions & 2 deletions src/js/aos.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,8 @@ let options = {
startEvent: 'DOMContentLoaded',
animatedClassName: 'aos-animate',
initClassName: 'aos-init',
useClassNames: false
useClassNames: false,
disableMutationObserver: false
};

// Detect not supported browsers (<=IE9)
Expand Down Expand Up @@ -141,7 +142,9 @@ const init = function init(settings) {
* If something is loaded by AJAX
* it'll refresh plugin automatically
*/
observe('[data-aos]', refreshHard);
if (!options.disableMutationObserver) {
observe('[data-aos]', refreshHard);
}

/**
* Don't init plugin if option `disable` is set
Expand Down

0 comments on commit 7c55654

Please sign in to comment.