Skip to content
This repository has been archived by the owner on Mar 31, 2023. It is now read-only.

Getting Drupal.behaviors to work in PL #287

Closed
mel-miller opened this issue Sep 6, 2018 · 3 comments · Fixed by #288
Closed

Getting Drupal.behaviors to work in PL #287

mel-miller opened this issue Sep 6, 2018 · 3 comments · Fixed by #288

Comments

@mel-miller
Copy link

What are the steps to getting Drupal.behaviors to work in Pattern Lab? Has it changed since the addition of the new pl_attach-library function?

I had them working in an older emulsify-based project but can't get it to work on a newer project (created from the develop branch of emulsify a few days ago).

I am able to verify that the library is getting attached to the component, it's just not working when I wrap it in a behavior.

Here's a copy of my _01.foot.twig file
I created each of those symlinks and uncommented the appropriate scripts.

  <!--DO NOT REMOVE-->
  {{ patternLabFoot | raw }}

  <!-- Drupal-specific usage -->
  <!-- example using symlinking -->
  <!-- cd web/themes/custom/emulsify/components/js -->
  <!-- ln -s ../../../../../core/assets/vendor/domready/ready.min.js ./ -->
  <!-- ln -s ../../../../../core/misc/drupal.js ./ -->
  <!-- ln -s ../../../../../core/assets/vendor/jquery/jquery.min.js ./ -->

  <!-- UNCOMMENT AS NECESSARY -->
  <script src="../../js/ready.min.js"></script>
  <script src="../../js/drupal.js"></script>
  <script src="../../js/jquery.min.js"></script>

  <!-- If using Drupal.behaviors, uncomment for them to work in Pattern Lab -->
  <script> Drupal.attachBehaviors(); </script>

  </body>
</html>
@evanmwillhite
Copy link
Contributor

Unfortunately - yea, this is a known issue with attach_library. I am going to try and devote time to this tomorrow.

@evanmwillhite
Copy link
Contributor

evanmwillhite commented Sep 6, 2018 •
edited
Loading

Temporarily while we're working on this, you can do the following steps:

  1. Move:
<script src="../../js/ready.min.js"></script>
<script src="../../js/drupal.js"></script>

from components/_meta/_01-foot.twig to inside the <head> tag in components/_meta/_00-head.twig.
2. Edit components/_twig-components/functions/pl_attach-library.function.php and remove the async attribute on line 25.

@mel-miller
Copy link
Author

Thanks @evanmwillhite. That makes sense.

@evanmwillhite evanmwillhite mentioned this issue Sep 7, 2018
Merged
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

move drupal js loading to head, reload scripts fourkitchens/emulsify
2 participants
@mel-miller @evanmwillhite