Skip to content

GitLab

Commit a19acbdf authored by effulgentsia's avatar effulgentsia
Browse files

Issue #3067085 by huzooka, lauriii, bnjmnm, tim.plunkett, phenaproxima: Views... 

Issue #3067085 by huzooka, lauriii, bnjmnm, tim.plunkett, phenaproxima: Views top dropbutton breaks when editing a view
parent 099c8978
Hide whitespace changes
Inline Side-by-side
Showing with 147 additions and 48 deletions
core/tests/Drupal/FunctionalJavascriptTests/Theme/ClaroViewsUiTest.php 0 → 100644
View file @ a19acbdf
<?php
namespace Drupal\FunctionalJavascriptTests\Theme;
use Drupal\FunctionalJavascriptTests\WebDriverTestBase;
/**
* Runs tests on Views UI using Claro.
*
* @group claro
*/
class ClaroViewsUiTest extends WebDriverTestBase {
/**
* {@inheritdoc}
*/
protected static $modules = ['views_ui'];
/**
* {@inheritdoc}
*/
protected $defaultTheme = 'claro';
/**
* {@inheritdoc}
*/
protected function setUp() {
parent::setUp();
// Disable automatic live preview to make the sequence of calls clearer.
$this->config('views.settings')->set('ui.always_live_preview', FALSE)->save();
// Create the test user and log in.
$admin_user = $this->drupalCreateUser([
'administer views',
'access administration pages',
'view the administration theme',
]);
$this->drupalLogin($admin_user);
}
/**
* Tests Views UI display menu tabs CSS classes.
*
* Ensures that the CSS classes added to display menu tabs are preserved when
* Views UI is updated with AJAX.
*/
public function testViewsUiTabsCssClasses() {
$this->drupalGet('admin/structure/views/view/who_s_online');
$assert_session = $this->assertSession();
$assert_session->elementExists('css', '#views-display-menu-tabs.views-tabs.views-tabs--secondary');
// Click on the Display name and wait for the Views UI dialog.
$assert_session->elementExists('css', '#edit-display-settings-top .views-display-setting a')->click();
$this->assertNotNull($this->assertSession()->waitForElement('css', '.js-views-ui-dialog'));
// Click the Apply button of the dialog.
$assert_session->elementExists('css', '.js-views-ui-dialog .ui-dialog-buttonpane')->findButton('Apply')->press();
// Wait for AJAX to finish.
$assert_session->assertWaitOnAjaxRequest();
// Check that the display menu tabs list still has the expected CSS classes.
$assert_session->elementExists('css', '#views-display-menu-tabs.views-tabs.views-tabs--secondary');
}
/**
* Tests Views UI dropbutton CSS classes.
*
* Ensures that the CSS classes added to the Views UI extra actions dropbutton
* in .views-display-top are preserved when Views UI is refreshed with AJAX.
*/
public function testViewsUiDropButtonCssClasses() {
$this->drupalGet('admin/structure/views/view/who_s_online');
$assert_session = $this->assertSession();
$extra_actions_dropbutton_list = $assert_session->elementExists('css', '#views-display-extra-actions.dropbutton--small');
$list_item_selectors = ['li:first-child', 'li:last-child'];
// Test list item CSS classes.
foreach ($list_item_selectors as $list_item_selector) {
$this->assertNotNull($extra_actions_dropbutton_list->find('css', "$list_item_selector.dropbutton__item.dropbutton__item--small"));
}
// Click on the Display name and wait for the Views UI dialog.
$assert_session->elementExists('css', '#edit-display-settings-top .views-display-setting a')->click();
$this->assertNotNull($this->assertSession()->waitForElement('css', '.js-views-ui-dialog'));
// Click the Apply button of the dialog.
$assert_session->elementExists('css', '.js-views-ui-dialog .ui-dialog-buttonpane')->findButton('Apply')->press();
// Wait for AJAX to finish.
$this->assertSession()->assertWaitOnAjaxRequest();
// Check that the drop button list still has the expected CSS classes.
$this->assertTrue($extra_actions_dropbutton_list->hasClass('dropbutton--small'));
// Check list item CSS classes.
foreach ($list_item_selectors as $list_item_selector) {
$this->assertNotNull($extra_actions_dropbutton_list->find('css', "$list_item_selector.dropbutton__item.dropbutton__item--small"));
}
}
}
core/themes/claro/claro.theme
View file @ a19acbdf
......@@ -521,69 +521,72 @@ function claro_form_media_form_alter(&$form, FormStateInterface $form_state) {
}
/**
* Implements hook_form_FORM_ID_alter() for view_edit_form.
* Implements hook_views_ui_display_top_alter().
*/
function claro_form_view_edit_form_alter(&$form, FormStateInterface $form_state) {
function claro_views_ui_display_top_alter(&$element) {
// @todo remove this after https://www.drupal.org/node/3051605 has been
// solved.
$form['displays']['top']['tabs']['#prefix'] = preg_replace('/(class="(.+\s)?)tabs(\s.+"|")/', '$1views-tabs$3', $form['displays']['top']['tabs']['#prefix']);
$form['displays']['top']['tabs']['#prefix'] = preg_replace('/(class="(.+\s)?)secondary(\s.+"|")/', '$1views-tabs--secondary$3', $form['displays']['top']['tabs']['#prefix']);
$element['tabs']['#prefix'] = preg_replace('/(class="(.+\s)?)tabs(\s.+"|")/', '$1views-tabs$3', $element['tabs']['#prefix']);
$element['tabs']['#prefix'] = preg_replace('/(class="(.+\s)?)secondary(\s.+"|")/', '$1views-tabs--secondary$3', $element['tabs']['#prefix']);
foreach (Element::children($form['displays']['top']['tabs']) as $tab) {
$form['displays']['top']['tabs'][$tab]['#theme'] = 'menu_local_task__views_ui';
foreach (Element::children($element['tabs']) as $tab) {
$element['tabs'][$tab]['#theme'] = 'menu_local_task__views_ui';
}
if (!empty($form['displays'])) {
// Change top extra actions to use the small dropbutton variant.
// @todo Revisit after https://www.drupal.org/node/3057581 is added.
if (!empty($form['displays']['top']['extra_actions'])) {
$form['displays']['top']['extra_actions']['#dropbutton_type'] = 'small';
}
// Change top extra actions to use the small dropbutton variant.
// @todo Revisit after https://www.drupal.org/node/3057581 is added.
if (!empty($element['extra_actions'])) {
$element['extra_actions']['#dropbutton_type'] = 'small';
}
}
// We process the dropbutton-like element on views edit form's
// display settings top section.
//
// That element should be a regular Dropbutton.
//
// After that the reported issue is fixed and the element is rendered with
// the Dropbutton type, we just have to set it's '#dropbutton_type' to
// 'extrasmall'.
//
// @todo: revisit after https://www.drupal.org/node/3057577 is fixed.
$dummy_dropbutton = &$form['displays']['settings']['settings_content']['tab_content']['details']['top']['actions'];
/**
* Implements hook_views_ui_display_tab_alter().
*/
function claro_views_ui_display_tab_alter(&$element) {
// We process the dropbutton-like element on views edit form's
// display settings top section.
//
// That element should be a regular Dropbutton.
//
// After that the reported issue is fixed and the element is rendered with
// the Dropbutton type, we just have to set it's '#dropbutton_type' to
// 'extrasmall'.
//
// @todo: revisit after https://www.drupal.org/node/3057577 is fixed.
$dummy_dropbutton = &$element['details']['top']['actions'];
if ($dummy_dropbutton) {
$child_keys = Element::children($dummy_dropbutton);
$prefix_regex = '/(<.*class\s*= *["\']?)([^"\']*)(.*)/i';
$child_count = 0;
if ($dummy_dropbutton) {
$child_keys = Element::children($dummy_dropbutton);
$prefix_regex = '/(<.*class\s*= *["\']?)([^"\']*)(.*)/i';
$child_count = 0;
foreach ($child_keys as $key) {
if (in_array($key, ['prefix', 'suffix'])) {
continue;
}
$nested_child_keys = Element::children($dummy_dropbutton[$key], TRUE);
foreach ($child_keys as $key) {
if (in_array($key, ['prefix', 'suffix'])) {
continue;
}
$nested_child_keys = Element::children($dummy_dropbutton[$key], TRUE);
if (!empty($nested_child_keys)) {
foreach ($nested_child_keys as $nested_key) {
$child_count++;
$prefix = $dummy_dropbutton[$key][$nested_key]['#prefix'];
$dummy_dropbutton[$key][$nested_key]['#prefix'] = preg_replace($prefix_regex, '$1$2 dropbutton__item dropbutton__item--extrasmall$3', $prefix);
}
}
else {
if (!empty($nested_child_keys)) {
foreach ($nested_child_keys as $nested_key) {
$child_count++;
$prefix = $dummy_dropbutton[$key]['#prefix'];
$dummy_dropbutton[$key]['#prefix'] = preg_replace($prefix_regex, '$1$2 dropbutton__item dropbutton__item--extrasmall$3', $prefix);
$prefix = $dummy_dropbutton[$key][$nested_key]['#prefix'];
$dummy_dropbutton[$key][$nested_key]['#prefix'] = preg_replace($prefix_regex, '$1$2 dropbutton__item dropbutton__item--extrasmall$3', $prefix);
}
}
if (!empty($dummy_dropbutton['prefix']) && !empty($dummy_dropbutton['prefix']['#markup'])) {
$classes = 'dropbutton--extrasmall ';
$classes .= ($child_count > 1) ? 'dropbutton--multiple' : 'dropbutton--single';
$prefix = $dummy_dropbutton['prefix']['#markup'];
$dummy_dropbutton['prefix']['#markup'] = preg_replace($prefix_regex, '$1$2 ' . $classes . '$3', $prefix);
else {
$child_count++;
$prefix = $dummy_dropbutton[$key]['#prefix'];
$dummy_dropbutton[$key]['#prefix'] = preg_replace($prefix_regex, '$1$2 dropbutton__item dropbutton__item--extrasmall$3', $prefix);
}
}
if (!empty($dummy_dropbutton['prefix']) && !empty($dummy_dropbutton['prefix']['#markup'])) {
$classes = 'dropbutton--extrasmall ';
$classes .= ($child_count > 1) ? 'dropbutton--multiple' : 'dropbutton--single';
$prefix = $dummy_dropbutton['prefix']['#markup'];
$dummy_dropbutton['prefix']['#markup'] = preg_replace($prefix_regex, '$1$2 ' . $classes . '$3', $prefix);
}
}
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment