Problem/Motivation

The current markup for Dropbutton looks like this:

<div class="dropbutton-wrapper dropbutton-processed dropbutton-multiple">
<div class="dropbutton-widget">
<ul class="dropbutton">
<li class="edit dropbutton-action"><a href="/admin/structure/views/view/content">Edit</a></li>
<li class="dropbutton-toggle"><button type="button"><span class="dropbutton-arrow"><span class="visually-hidden">List additional actions</span></span></button></li>
<li class="clone dropbutton-action secondary-action"><a href="/admin/structure/views/view/content/clone">Clone</a></li>
<li class="disable dropbutton-action secondary-action"><a href="/admin/structure/views/view/content/disable?token=hQ2egsGF5LtsScdw2oQFeoWNKrUi1HHP9W1WZhjehOk" class="use-ajax ajax-processed">Disable</a></li>
<li class="delete dropbutton-action secondary-action"><a href="/admin/structure/views/view/content/delete">Delete</a></li>
</ul>
</div>
</div>

There's a lot we could do we simplify and improve the markup so it's inline with our CSS coding standards

Proposed resolution

<div class="dropbutton dropbutton--modifier"> <!-- whole component is dropbutton. -->
  <a class="button dropbutton__action">Action One</a>
  <button type="button" class="button dropbutton__trigger">
    <span class="visually-hidden">List additional actions</span>
  </button>
  <ul class="dropbutton__menu" role="menu">
    <li><a class="dropbutton__action">Action Two</a></li>
    <li><a class="dropbutton__action">Action Three</a></li>
  </ul>
</div>

Remaining tasks

Decide on a battle plan of improvements
Write a patch
Test a lot

User interface changes

None

API changes

Mark up changes

Files: 
CommentFileSizeAuthor
#77 core-js-dropbutton-2278473-77.patch54.41 KBnod_
#73 interdiff.txt16.03 KBnod_
#73 core-js-dropbutton-2278473-73.patch50.65 KBnod_
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 117,157 pass(es), 82 fail(s), and 143 exception(s). View
#67 core-js-dropbutton-2278473-67.patch42.3 KBnod_
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 117,224 pass(es), 36 fail(s), and 25 exception(s). View
#64 Screenshot 2015-10-06 23.38.50.jpg21.28 KBLewisNyman
#64 Screenshot 2015-10-06 23.38.18.jpg13.42 KBLewisNyman
#64 Screenshot 2015-10-06 23.34.04.jpg22.84 KBLewisNyman
#64 Screenshot 2015-10-06 23.33.53.jpg15.91 KBLewisNyman
#64 Screenshot 2015-10-06 23.33.37.jpg22 KBLewisNyman
#64 Screenshot 2015-10-06 23.33.27.jpg16.1 KBLewisNyman
#64 simplify_dropbutton-2278473-64.patch47.38 KBLewisNyman
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 116,202 pass(es), 1 fail(s), and 0 exception(s). View
#64 interdiff.txt26.3 KBLewisNyman
#57 dropbutton-markup-2278473-57.patch40.94 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 113,894 pass(es), 4 fail(s), and 0 exception(s). View
#54 dropbutton-reroll.patch40.74 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 113,808 pass(es), 58 fail(s), and 25 exception(s). View
#48 Screenshot 2015-09-10 16.32.57.jpg564.37 KBLewisNyman
#48 Screenshot 2015-09-10 16.32.52.jpg543.8 KBLewisNyman
#47 simplify_dropbutton-2278473-47.patch43.64 KBLewisNyman
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] Unable to apply patch simplify_dropbutton-2278473-47_0.patch. Unable to apply patch. See the log in the details link for more information. View
#47 interdiff.txt20.5 KBLewisNyman
#43 dropbutton-markup-2278473-43.patch35.59 KBrteijeiro
PASSED: [[SimpleTest]]: [PHP 5.5 MySQL] 100,620 pass(es). View
#42 dropbutton-markup-2278473-42.patch32.9 KBscaragucc'
PASSED: [[SimpleTest]]: [PHP 5.5 MySQL] 100,598 pass(es). View
#40 interdiff-2278473-37-40.txt17.89 KBscaragucc'
#40 dropbutton-markup-2278473-40.patch32.89 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 99,631 pass(es), 26 fail(s), and 0 exception(s). View
#37 interdiff-2278473-33-37.txt6.53 KBscaragucc'
#37 dropbutton-markup-2278473-37.patch17.89 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,885 pass(es), 27 fail(s), and 0 exception(s). View
#33 interdiff-2278473-30-33.txt9.54 KBscaragucc'
#33 dropbutton-markup-2278473-33.patch15.29 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,923 pass(es), 38 fail(s), and 1 exception(s). View
#30 dropbutton-markup-2278473-30.patch11.49 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,762 pass(es), 63 fail(s), and 25 exception(s). View
#27 dropbutton.patch10.74 KBscaragucc'
FAILED: [[SimpleTest]]: [PHP 5.4 MySQL] 94,260 pass(es), 63 fail(s), and 25 exception(s). View
#14 dropbottom-2.diff43.15 KBmortendk
FAILED: [[SimpleTest]]: [PHP 5.4 MySQL] 87,160 pass(es), 35 fail(s), and 31 exception(s). View

Comments

LewisNyman’s picture

Issue summary: View changes
Issue tags: +dreammarkup

I've updated the summary with the blue sky markup:

nod_’s picture

No empty <a>. Parts of the code has been for JS reasons, can't remember which ones yet but expect to run into troubles with just this markup.

tim.plunkett’s picture

The proposed markup seems to be a a11y regression.

mgifford’s picture

Any reason why we can't use the span in the trigger - <span class="visually-hidden">List additional actions</span>

It's way cleaner code which is great. If it is a button, shouldn't it semantically be defined that way? https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Tec...

scaragucc&#039;’s picture

Assigned: Unassigned » scaragucc'
scaragucc&#039;’s picture

Issue summary: View changes

Updating issue summary to add wrapper div for proposed solution.

My plan of attack:

* Add a dropbutton.html.twig file and associated preprocess. If single then only output a button, if multiple then a dropbutton.
* Rework css/js to get back to current UI.
* Test. A lot.

scaragucc&#039;’s picture

Adding more notes from my initial research.

Views UI generates markup in ViewsEditForm.php in two spots (function getDisplayDetails, function renderDisplayTop) and that needs to get updated. Ideally those two functions will call preRenderDropbutton() in Dropbutton.php so that dropbuttons are always generated in the same way.

droplet’s picture

<div class="dropbutton dropbutton--modifier"> <!-- whole component is dropbutton. -->
  <a class="button dropbutton__action">Action One</a>
  <button type="button" class="button dropbutton__trigger">
    <span class="visually-hidden">List additional actions</span>
  </button>
  <ul class="dropbutton__menu" role="menu">
    <li><a class="dropbutton__action">Action Two</a></li>
    <li><a class="dropbutton__action">Action Three</a></li>
  </ul>
</div>

Code self explanation. Cheers.

scaragucc&#039;’s picture

@LewisNyman, what do you think of droplet's suggested markup?

LewisNyman’s picture

I don't like the idea of added comments in mark up, because it will print with every dropbutton. I kind of hope that our CSS standards are clear so we know what a component is and isn't by the time Drupal 8 is out.

LewisNyman’s picture

Issue summary: View changes

Ok, I spoke to Adam properly about the issue. I think droplet's suggestions look good, updated the issue summary,

YesCT’s picture

LewisNyman’s picture

Assigned: scaragucc' » Unassigned
mortendk’s picture

Issue tags: +banana
FileSize
43.15 KB
FAILED: [[SimpleTest]]: [PHP 5.4 MySQL] 87,160 pass(es), 35 fail(s), and 31 exception(s). View

I started the work of renaming the existing structure to a classname structure when during the banana clean up.
The real issue here is that dropbottom dont uses BEM & --modifiers, or prefixes the js required classes.
Getting those things fixed at first would be important win to get. We dont wanna end up in a situation with a component that will conflict with the css, as its the case now.

<div class="js-dropbutton-wrapper js-dropbutton-processed js-dropbutton-wrapper--multiple">
  <div class="js-dropbutton-widget">
  <ul class="js-dropbutton">
  <li class="publish js-dropbutton-action">
    <input type="submit" name="op" value="Save and keep published" class="button form-submit">
  </li>
  <li class="js-dropbutton__toggle">
    <button type="button">
      <span class="js-dropbutton__toggle__arrow">
        <span class="visually-hidden">List additional actions</span>
      </span>
    </button>
  </li>
  <li class="unpublish js-dropbutton-action js-dropbutton__secondary-action">
    <input type="submit" name="op" value="Save and unpublish" class="button form-submit">
  </li>
</ul>
</div>

what we should look into is separating the classe so its clear whats used for "theme" so we dont use the js- prefixed classes for that all over.

mortendk’s picture

Status: Active » Needs review

Status: Needs review » Needs work

The last submitted patch, 14: dropbottom-2.diff, failed testing.

droplet’s picture

js-prefixed all elements. pretty bad idea.

mortendk’s picture

@droplet about prefix how Else would You "protect" css classes that's only used for js?

we prefix classes that are needed for the js to work.
it's how it should be done according to our CSS docs in d8

LewisNyman’s picture

A lot of the class changes here are simply swap child selectors for underscores, we have a suggestion in the issue summary for markup that makes more sense. A lot of the current classes don't have a lot of meaning. I don't know if it makes sense to add the .js- prefix when those classes are added in Javascript?

  1. +++ b/core/misc/dropbutton/dropbutton.js
    @@ -59,12 +59,12 @@
    -        .addClass('dropbutton-multiple')
    +        .addClass('js-dropbutton-wrapper--multiple')
    

    Can we have the dropbutton class as the wrapper class instead? So this class would be dropbutton--multiple

  2. +++ b/core/misc/dropbutton/dropbutton.js
    @@ -111,8 +111,8 @@
    -      show = isBool ? show : !this.$dropbutton.hasClass('open');
    -      this.$dropbutton.toggleClass('open', show);
    +      show = isBool ? show : !this.$dropbutton.hasClass('js-dropbutton-wrapper--is-open');
    +      this.$dropbutton.toggleClass('js-dropbutton-wrapper--is-open', show);
    

    This should be using the a .is-open state class,.

  3. +++ b/core/misc/dropbutton/dropbutton.theme.css
    @@ -1,34 +1,188 @@
    +      <span class="js-dropbutton__toggle__arrow">
    

    We can simplify this to js-dropbutton__toggle-arrow instead and it becomes less dependant on markup structure

  4. +++ b/core/misc/dropbutton/dropbutton.theme.css
    @@ -1,34 +1,188 @@
    -.dropbutton .dropbutton-action > * {
    +.js-dropbutton .js-dropbutton__action > * {
    ...
    -.dropbutton .secondary-action {
    +.js-dropbutton .js-dropbutton__secondary-action {
    

    We can remove the .js-dropbutton classes from these selectors so they are shorter

  5. +++ b/core/themes/seven/css/base/print.css
    @@ -59,21 +59,31 @@
    -  input.form-autocomplete, input.form-text, input.form-tel, input.form-email, input.form-url, input.form-search, input.form-number, input.form-color, input.form-file, textarea.form-textarea, select.form-select {
    +  input.form-autocomplete,
    +  input.form-text,
    +  input.form-tel,
    +  input.form-email,
    +  input.form-url,
    +  input.form-search,
    +  input.form-number,
    +  input.form-color,
    +  input.form-file,
    +  textarea.form-textarea,
    +  select.form-select {
         border-width: 1px;
       }
    

    This change has nothing to do with dropbutton, can we remove this?

LewisNyman’s picture

TDLR, droplet is right, morten is wrong ;-) Sorry

The coding standards provide specific directions on this:

/**
* Functional JavaScript Hooks
*
* When querying or manipulating the DOM from JavaScript, prefer dedicated
* classes not used for styling (or the id attribute).
* If using classes, prefix them with 'js-' to mark them for JS use.
* These 'js-' classes should not appear in stylesheets.
*/
.js-behaviour-hook /* e.g. .js-slider, .js-dropdown */

Which means, if we need a class for js functionality, we should use a new class that is only used for functionality, not just adapt the classes we use for styling. We shouldn't have any .js- prefixed classes in stylesheets.

mortendk’s picture

TDLR : seperate the css & js first, then play around with class names later.

@lewis well then how do you then propose we seperate the js from the css without using .js- ;)
We gotta get the seperation done first, if thats not done the rest dont matter, then were back in the same mess as d6, d7
So instead of this dance around classnames how about we start with getting the seperation done first

Rewriting everything with new markup etc, is a fine goal - but at RC-1 all markup is locked down.

LewisNyman’s picture

@lewis well then how do you then propose we seperate the js from the css without using .js-

We just need to split it in to two classes. One that is functional, and one that is for styling.

mortendk’s picture

@lewis ok so we turn this issue into doing that or do we still wanna rewrite it all ?

LewisNyman’s picture

This issue is about rewriting the Dropbutton markup inline with our CSS standards. If the patch doesn't match our CSS standards then it's not fixing this issue. The issue summary has the markup suggestion but I think it needs updating with the js- classes?.

scaragucc&#039;’s picture

I'm at Drupalcon LA and restarting work on this issue. Combining the original CSS classes from @lewis and the required "js-" classes from @morten leaves us with something like for an open dropbutton:

<div class="dropbutton dropbutton--modifier is-open"> <!-- whole component is dropbutton. -->
  <a class="button dropbutton__action">Action One</a>
  <button type="button" class="button dropbutton__trigger">
    <span class="visually-hidden">List additional actions</span>
  </button>
  <ul class="dropbutton__menu js-dropbutton__menu" role="menu">
    <li><a class="dropbutton__action">Action Two</a></li>
    <li><a class="dropbutton__action">Action Three</a></li>
  </ul>
</div>

My plan of attack:

  • Make the appropriate markup changes in /core/misc/dropbutton/dropbutton.js and /core/modules/system/templates/dropbutton-wrapper.html.twig
  • Rename dropbutton-wrapper.html.twig to dropbutton.html.twig
  • Refactor CSS
scaragucc&#039;’s picture

FileSize
10.74 KB
FAILED: [[SimpleTest]]: [PHP 5.4 MySQL] 94,260 pass(es), 63 fail(s), and 25 exception(s). View

This patch has all the new markup as well as JS and CSS changes.

Next steps:

  • CSS still needs to be formatted according to the Drupal 8 standards.
  • Test, test, test!!!
LewisNyman’s picture

Status: Needs work » Needs review

Status: Needs review » Needs work

The last submitted patch, 27: dropbutton.patch, failed testing.

scaragucc&#039;’s picture

FileSize
11.49 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,762 pass(es), 63 fail(s), and 25 exception(s). View

Rebased against 8.0.x and found a JS error. Also cleaned up the CSS according Drupal standards, but for Bartik only at this point. Before I address the CSS changes for Seven and Classy I want to run testbot to track down what tests will need updating (xpath tests against CSS classes and when the classes change the tests too need to change).

LewisNyman’s picture

Status: Needs work » Needs review

Status: Needs review » Needs work

The last submitted patch, 30: dropbutton-markup-2278473-30.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
15.29 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,923 pass(es), 38 fail(s), and 1 exception(s). View
9.54 KB

This patch contains the following changes/additions from the previous one in 30.

  • There were some mistakes in my Jquery so I've fixed those.
  • Fixed whitespace errors in CSS.
  • Small CSS changes for dropbutton--single.
  • Rewrote xpath conditions for a few tests to accommodate the new markup.

Status: Needs review » Needs work

The last submitted patch, 33: dropbutton-markup-2278473-33.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
12.19 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] Unable to apply patch dropbutton-markup-2278473-35.patch. Unable to apply patch. See the log in the details link for more information. View

This patch contains:

  • Found some jquery implementation errors on my part.
  • Fixed whitespace errors in CSS.
  • Updated tests to have correct current dropbutton selectors.

Had trouble creating the interdiff this time. Sorry that it's missing.

Status: Needs review » Needs work

The last submitted patch, 35: dropbutton-markup-2278473-35.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
17.89 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 98,885 pass(es), 27 fail(s), and 0 exception(s). View
6.53 KB

Rerolled patch, and got the interdiff too!

scaragucc&#039;’s picture

Status: Needs review » Needs work

The last submitted patch, 37: dropbutton-markup-2278473-37.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
32.89 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 99,631 pass(es), 26 fail(s), and 0 exception(s). View
17.89 KB

This patch contains:

  • Fixed more whitespace errors in CSS.
  • Updated the remainder of tests to have correct current dropbutton selectors.
  • Replaced the selectors in Seven with the new ones but there are issues with look/feel in Seven and Classy. I'd like to get the maintainers of those themes to weigh in on how much CSS should remain in dropbutton.css and how much should be theme specific.

Please note that even if this patch passes all tests it is NOT ready for review until the issue I raised in the 3rd bullet point is resolved.

Status: Needs review » Needs work

The last submitted patch, 40: dropbutton-markup-2278473-40.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
32.9 KB
PASSED: [[SimpleTest]]: [PHP 5.5 MySQL] 100,598 pass(es). View

Only change is two spaces on line 160 of RowRenderCacheTest.php without which the assertEqual on line 165 fails.

rteijeiro’s picture

Issue summary: View changes
FileSize
35.59 KB
PASSED: [[SimpleTest]]: [PHP 5.5 MySQL] 100,620 pass(es). View
1.32 KB
17.04 KB
35.95 KB

Well, it seems this still needs some work as you can see in the screenshots:

DROPDOWN BUTTON BEFORE

DROPDOWN BUTTON AFTER

Just fixed a couple of nits. I wonder what is the standard when using [dir="rtl"], in some places there is a space after and in other places no.

LewisNyman’s picture

Issue tags: +classy

I think the first thing we need to do is decide how it should look in Stark and Classy. I assume that it should not apply anything on Stark. For Classy, I think that it should basically look as the Seven design but without colors. I think this fits with how Bartik was using Dropbutton before as well.

I would be good to get agreement from the Classy maintainers.

davidhernandez’s picture

Which means, if we need a class for js functionality, we should use a new class that is only used for functionality

Is it possible to use data attributes for this? We really do want to get away from the js- prefixes. We're just using it as a last result of sorts to split the existing ones.

I assume that it should not apply anything on Stark

Yes. Stark should remain as close to browser defaults as possible.

For Classy, I think that it should basically look as the Seven design but without colors

Yes. I didn't pour over the CSS, but we are ok to have the structural stuff in Classy, but not colors and other styling. And so long as this is an agreed upon standard for how we want buttons or whatever to look for Drupal and the style guide. Not just the default place to dump stuff that Seven and Bartik use.

LewisNyman’s picture

I thought about this a little more, Classy should have so minimal styles that Seven and Bartik shouldn't have to undo any styling to apply their design. I think that would be a sign that Classy is doing too much. Maybe a styleguide for Classy would make sense at some point.

LewisNyman’s picture

Issue tags: +Seven
FileSize
20.5 KB
43.64 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] Unable to apply patch simplify_dropbutton-2278473-47.patch. Unable to apply patch. See the log in the details link for more information. View
20.5 KB
43.64 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] Unable to apply patch simplify_dropbutton-2278473-47_0.patch. Unable to apply patch. See the log in the details link for more information. View

I had a look through this patch and ended up changing a lot. This is my proposal for the Classy styling. I also ripped out the dropbutton--single/dropbutton--multiple stuff and now only apply the dropbutton class when there is more than one, otherwise apply a button class. Seven and Bartik don't look right but I want feedback on the Classy implementation first.

.

LewisNyman’s picture

FileSize
543.8 KB
564.37 KB

Screenshots:

The last submitted patch, 47: simplify_dropbutton-2278473-47.patch, failed testing.

Status: Needs review » Needs work

The last submitted patch, 47: simplify_dropbutton-2278473-47.patch, failed testing.

The last submitted patch, 47: simplify_dropbutton-2278473-47.patch, failed testing.

The last submitted patch, 47: simplify_dropbutton-2278473-47.patch, failed testing.

scaragucc&#039;’s picture

Working on a reroll for this, will also review Lewis' separation of styles between core and Classy.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
40.74 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 113,808 pass(es), 58 fail(s), and 25 exception(s). View

Rerolled patch.

Status: Needs review » Needs work

The last submitted patch, 54: dropbutton-reroll.patch, failed testing.

The last submitted patch, 54: dropbutton-reroll.patch, failed testing.

scaragucc&#039;’s picture

Status: Needs work » Needs review
FileSize
40.94 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 113,894 pass(es), 4 fail(s), and 0 exception(s). View
4.84 KB

Lewis had changed the .dropbutton class to .js-dropbutton so I've fixed the tests to accommodate for that.

Status: Needs review » Needs work

The last submitted patch, 57: dropbutton-markup-2278473-57.patch, failed testing.

scaragucc&#039;’s picture

Missed two! Should be all set now...

scaragucc&#039;’s picture

Status: Needs work » Needs review
scaragucc&#039;’s picture

FileSize
40.94 KB
PASSED: [[SimpleTest]]: [PHP 5.5 MySQL] 113,948 pass(es). View
913 bytes

Forgot to attach patch and interdiff for #59.

The last submitted patch, 57: dropbutton-markup-2278473-57.patch, failed testing.

joelpittet’s picture

Just a quick review:

  1. +++ b/core/misc/dropbutton/dropbutton.css
    @@ -1,164 +1,118 @@
    + * with a primary action. Secondary actions are hidden in a dropdown menu.
    + *
      */
    

    Don't need this extra line at the end.

  2. +++ b/core/misc/dropbutton/dropbutton.css
    @@ -1,164 +1,118 @@
    - * When a dropbutton has only one option, it is simply a button.
    + * The button class is added when there is only one action. This should be moved
    + * to button.css
    

    This looks like an @todo?

Does all of this need to be done here or can some of it be broken off to keep the patch easier to review?

LewisNyman’s picture

Issue summary: View changes
Issue tags: +rc deadline
FileSize
26.3 KB
47.38 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 116,202 pass(es), 1 fail(s), and 0 exception(s). View
16.1 KB
22 KB
15.91 KB
22.84 KB
13.42 KB
21.28 KB

Fixed some of these comments here and realised there was still a lot of work to do. One final push before RC. Here are some screenshots from Classy, Bartik, and Seven.

Status: Needs review » Needs work

The last submitted patch, 64: simplify_dropbutton-2278473-64.patch, failed testing.

The last submitted patch, 64: simplify_dropbutton-2278473-64.patch, failed testing.

nod_’s picture

Status: Needs work » Needs review
FileSize
42.3 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 117,224 pass(es), 36 fail(s), and 25 exception(s). View

Interdiff doesn't work straight away so not uploading one.

Rmoved css file from core dropbutton library.
Removed leftover </li> from js theme function.
Simplified the JS, I don't like unwrap. It's more predictable now.
Added .dropbutton to all dropbuttons (not just the ones with a menu). This fixes problems with views ui.
Added the previously used .dropbutton-multiple on dropbuttons with menus (This class only adds the padding required).

Status: Needs review » Needs work

The last submitted patch, 67: core-js-dropbutton-2278473-67.patch, failed testing.

The last submitted patch, 67: core-js-dropbutton-2278473-67.patch, failed testing.

Status: Needs work » Needs review

Status: Needs review » Needs work

The last submitted patch, 67: core-js-dropbutton-2278473-67.patch, failed testing.

nod_’s picture

Assigned: Unassigned » nod_

might as well go with a data attribute right now. rolling patch and fixing tests.

nod_’s picture

Assigned: nod_ » Unassigned
Status: Needs work » Needs review
FileSize
50.65 KB
FAILED: [[SimpleTest]]: [PHP 5.5 MySQL] 117,157 pass(es), 82 fail(s), and 143 exception(s). View
16.03 KB

got rid of js-dropbutton and used data-drupal-dropbutton as it should.

Things are still working on the frontend, let's see how much I broke tests.

Status: Needs review » Needs work

The last submitted patch, 73: core-js-dropbutton-2278473-73.patch, failed testing.

The last submitted patch, 73: core-js-dropbutton-2278473-73.patch, failed testing.

davidhernandez’s picture

Not sure this can be committed now. Markup and CSS is frozen after RC.

nod_’s picture

Status: Needs work » Needs review
FileSize
54.41 KB

Local tests take too long, sorry for the noise while I fix remaining test failures.

nod_’s picture

Did some profiling, the new code is marginally faster.

Status: Needs review » Needs work

The last submitted patch, 77: core-js-dropbutton-2278473-77.patch, failed testing.

Version: 8.0.x-dev » 8.1.x-dev

Drupal 8.0.6 was released on April 6 and is the final bugfix release for the Drupal 8.0.x series. Drupal 8.0.x will not receive any further development aside from security fixes. Drupal 8.1.0-rc1 is now available and sites should prepare to update to 8.1.0.

Bug reports should be targeted against the 8.1.x-dev branch from now on, and new development or disruptive changes should be targeted against the 8.2.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

emma.maria’s picture

Version: 8.1.x-dev » 8.2.x-dev
Issue tags: -rc deadline

As we are now Post Drupal 8 release, can the future steps for this issue be laid out please?
ie. Looking at the code in the latest patch - what can still be used, what needs to go and where do we move things to?

We have bugs being raised based on contrib modules having dropbuttons with single values having no styles. This issue will solve that with the solo value = button markup.
#2700521: dropbutton with a single option missing its rounded corners

Version: 8.2.x-dev » 8.3.x-dev

Drupal 8.2.0-beta1 was released on August 3, 2016, which means new developments and disruptive changes should now be targeted against the 8.3.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.

Version: 8.3.x-dev » 8.4.x-dev

Drupal 8.3.0-alpha1 will be released the week of January 30, 2017, which means new developments and disruptive changes should now be targeted against the 8.4.x-dev branch. For more information see the Drupal 8 minor version schedule and the Allowed changes during the Drupal 8 release cycle.