Problem/Motivation

I found two problems with workbench_access.js that make it not work for us:

  • The selector uses the wrong classes form-item-editors-add-mass instead of form-item--editors-add-mass.
  • The default event is not prevented so a click on the link scrolls to the top of the page (because of the # value in href).

Steps to reproduce

  1. Enable Claro as back-office theme.
  2. Create a section.
  3. Browse to /admin/config/workflow/workbench_access/article/sections/foo/users.
  4. Both adding method are displayed at the same time and clicking on "Switch between textarea/autocomplete" does nothing except scrolling to the top of the page.

Proposed resolution

The JS should target the correct classes and the event callback should call e.preventDefault();.

Remaining tasks

I will submit a patch.

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

prudloff created an issue. See original summary.

prudloff’s picture

Status: Active » Needs review
agentrickard’s picture

Status: Needs review » Postponed (maintainer needs more info)

What version of Drupal?

prudloff’s picture

We are using Drupal 9.1.4.

agentrickard’s picture

Status: Postponed (maintainer needs more info) » Active

Thanks!

agentrickard’s picture

Status: Active » Needs work

So, I have a philosophical problem with this issue.

- Claro is experimental
- Claro is what changed the form / class structure.
- This works fine with Seven, as intended.

So what, exactly, are we supposed to do here?

Seven:

<div class="js-form-item form-item js-form-type-textarea form-type-textarea js-form-item-editors-add-mass form-item-editors-add-mass" style="">
      <label for="edit-editors-add-mass">Add editors to the <em class="placeholder">Alumni</em> section.</label>
        <div class="form-textarea-wrapper">
  <textarea data-drupal-selector="edit-editors-add-mass" aria-describedby="edit-editors-add-mass--description" id="edit-editors-add-mass" name="editors_add_mass" rows="5" cols="60" class="form-textarea resize-vertical"></textarea>
</div>

            <div id="edit-editors-add-mass--description" class="description">
      Add a list of user ids or usernames separated with comma or new line. Invalid or existing users will be ignored.<br><a class="switch" href="#">Switch between textarea/autocomplete</a>
    </div>
  </div>

I am not fixing one to break the other.

agentrickard’s picture

Title: workbench_access.js does nothing » Claro theme breaks workbench_access.js
larowlan’s picture

Can we have our own attribute, eg a data attribute, and target that, rather than rely on classes added by the theme?

agentrickard’s picture

Status: Needs work » Needs review
StatusFileSize
new713 bytes

Or a class that we add directly from the $form that is only used as a target, but doing so ignored the bounding DIV.

Using the `.js-form-item-editors-add` class(es) seems to fix the issue.

agentrickard’s picture

StatusFileSize
new744 bytes

New version with e.preventDefault(); added.

larowlan’s picture

Status: Needs review » Reviewed & tested by the community

Looks good to me

  • agentrickard committed 5c8f803 on 8.x-1.x
    Issue #3219113 by agentrickard, prudloff, larowlan: Claro theme breaks...
agentrickard’s picture

Status: Reviewed & tested by the community » Fixed

Committed.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.