Steps to reproduce

  1. Content -> Add content -> any page.
  2. Use Layout builder -> Block -> Configure block -> Style -> Animation -> Scroll Effects (any valid effects)
  3. Logout of admin
  4. Visit the page

I got the following error in firefox console. The page works, but the animation block is empty (space is occupied, but no content).

Uncaught TypeError: Drupal is undefined
    <anonymous> http://d9.featuriz.local/modules/contrib/bootstrap_styles/js/plugins/scroll_effects/build.js?v=1.x:9
    <anonymous> http://d9.featuriz.local/modules/contrib/bootstrap_styles/js/plugins/scroll_effects/build.js?v=1.x:15

When I checked the js files, the code for this problem is that,

(function ($, _, Drupal, drupalSettings) {
  "use strict";

  Drupal.behaviors.scrollEffectsInit = {
    attach: function (context, settings) {
      AOS.init();
    }
  }

})(window.jQuery, window._, window.Drupal, window.drupalSettings);

In this, The js cannot find window.Drupal .

Proposed resolution

My temperory Solution is,

web/modules/contrib/bootstrap_styles/bootstrap_styles.libraries.yml

# scroll_effects
plugin.scroll_effects.build:
  remote: https://michalsnik.github.io/aos
  version: 1.x
  license:
    name: MIT
    url: https://github.com/michalsnik/aos/blob/master/LICENSE
    gpl-compatible: true
  js:
    https://unpkg.com/aos@2.3.1/dist/aos.js: { weight: -3, minified: true }
    js/plugins/scroll_effects/build.js: { }
  dependencies:
    - core/drupal
    - core/drupalSettings
  css:
    theme:
      https://unpkg.com/aos@2.3.1/dist/aos.css: { }

I added this,

dependencies:
    - core/drupal
    - core/drupalSettings

Now no error, works goods.

I request developer to do proper changes or I may be wrong, so please guide me.

Comments

featuriz created an issue.

dubs’s picture

Yes, this is the correct approach. Please can this be added?