Skip to content

GitLab

T
tangled
Commit 9a670d48 authored by michaelpg's avatar michaelpg Committed by Commit bot
Browse files
Options

Replace Manage Languages with dialog and dropdown item 

Remove the sub-page. Add a simple dialog to select new languages. Add an
option to the language list to remove a language.

A search box will be added to the dialog next.

BUG=630982
TEST=SettingsLanguagesPageBrowserTest
R=stevenjb@chromium.org
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2265253002
Cr-Commit-Position: refs/heads/master@{#414246}
parent 449e2fc9
Hide whitespace changes
Inline Side-by-side
Showing with 368 additions and 187 deletions
chrome/app/settings_strings.grdp
View file @ 9a670d48
......@@ -966,11 +966,14 @@
<message name="IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_MOVE_DOWN" desc="Label for the menu item that moves the language down in the list of languages.">
Move down
</message>
<message name="IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_REMOVE" desc="Label for the menu item to remove a language from the list of enabled languages.">
Remove
</message>
<message name="IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_LANGUAGE_DETAIL" desc="Label for the menu item which opens a sub-page that displays details for a language.">
Language settings
</message>
<message name="IDS_SETTINGS_LANGUAGES_LANGUAGES_MANAGE" desc="Button under the list of enabled languages which opens a sub-page that lets the user enable or disable languages.">
Manage languages
<message name="IDS_SETTINGS_LANGUAGES_LANGUAGES_ADD" desc="Button under the list of enabled languages which opens a dialog that lets the user enable additional languages.">
Add languages
</message>
<message name="IDS_SETTINGS_LANGUAGES_OFFER_TO_TRANSLATE_IN_THIS_LANGUAGE" desc="The label for a checkbox which indicates whether or not pages in this language should be translated by default.">
Offer to translate pages in this language
......@@ -989,8 +992,8 @@
Manage input methods
</message>
</if>
<message name="IDS_SETTINGS_LANGUAGES_MANAGE_LANGUAGES_TITLE" desc="Name of the settings sub-page which allows enabling and disabling languages.">
Manage languages
<message name="IDS_SETTINGS_LANGUAGES_MANAGE_LANGUAGES_TITLE" desc="Name of the settings dialog which allows enabling additional languages.">
Add languages
</message>
<message name="IDS_SETTINGS_LANGUAGES_ALL_LANGUAGES" desc="Header for the list of all supported languages, which the user can use to enable languages, on the Manage Languages page.">
All languages
......
chrome/browser/resources/settings/languages_page/add_languages_dialog.html 0 → 100644
View file @ 9a670d48
<link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
<link rel="import" href="/languages_page/languages.html">
<link rel="import" href="/settings_shared_css.html">
<dom-module id="settings-add-languages-dialog">
<template>
<style include="settings-shared">
dialog {
display: flex;
flex-direction: column;
}
.body {
display: flex;
flex-direction: column;
max-height: 250px;
overflow: auto;
}
.ripple-padding {
/* Create a little extra space for checkbox ink ripple to flow into. */
padding-left: 20px;
}
</style>
<dialog is="cr-dialog" id="dialog">
<div class="title">$i18n{addLanguagesDialogTitle}</div>
<div class="body">
<!-- TODO(michaelpg): Dynamic language search/filtering. -->
<iron-list class="ripple-padding" scroll-target="[[$$('.body')]]"
items="[[getAvailableLanguages_(
languages.supported, languages.enabled.*)]]">
<template>
<paper-checkbox class="list-item" checked="[[willAdd_(item.code)]]"
title$="[[item.nativeDisplayName]]"
on-change="onLanguageCheckboxChange_">
[[item.displayName]]
</paper-checkbox>
</template>
</iron-list>
</div>
<div class="button-container">
<div class="action-buttons">
<paper-button class="cancel-button" on-tap="onCancelButtonTap_">
$i18n{cancel}
</paper-button>
<paper-button class="action-button" on-tap="onActionButtonTap_"
disabled="[[disableActionButton_]]">
$i18n{add}
</paper-button>
</div>
</div>
</dialog>
</template>
<script src="add_languages_dialog.js"></script>
</dom-module>
chrome/browser/resources/settings/languages_page/add_languages_dialog.js 0 → 100644
View file @ 9a670d48
// Copyright 2016 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
/**
* @fileoverview 'settings-add-languages-dialog' is a dialog for enabling
* languages.
*/
Polymer({
is: 'settings-add-languages-dialog',
properties: {
/** @type {!LanguagesModel|undefined} */
languages: {
type: Object,
notify: true,
},
/** @type {!LanguageHelper} */
languageHelper: Object,
/** @private {!Set<string>} */
languagesToAdd_: {
type: Object,
value: function() { return new Set(); },
},
/** @private */
disableActionButton_: {
type: Boolean,
value: true,
},
},
attached: function() {
this.$.dialog.showModal();
},
/**
* Returns the supported languages that are not yet enabled, based on
* the LanguageHelper's enabled languages list.
* @param {!Array<!chrome.languageSettingsPrivate.Language>}
* supportedLanguages
* @param {!Object} enabledLanguagesChange Polymer change record for
* |enabledLanguages|.
* @return {!Array<!chrome.languageSettingsPrivate.Language>}
* @private
*/
getAvailableLanguages_: function(supportedLanguages, enabledLanguagesChange) {
return supportedLanguages.filter(function(language) {
return !this.languageHelper.isLanguageEnabled(language.code);
}.bind(this));
},
/**
* True if the user has chosen to add this language (checked its checkbox).
* @return {boolean}
* @private
*/
willAdd_: function(languageCode) {
return this.languagesToAdd_.has(languageCode);
},
/**
* Handler for checking or unchecking a language item.
* @param {!{model: !{item: !chrome.languageSettingsPrivate.Language},
* target: !PaperCheckboxElement}} e
* @private
*/
onLanguageCheckboxChange_: function(e) {
// Add or remove the item to the Set. No need to worry about data binding:
// willAdd_ is called to initialize the checkbox state (in case the
// iron-list re-uses a previous checkbox), and the checkbox can only be
// changed after that by user action.
var code = e.model.item.code;
if (e.target.checked)
this.languagesToAdd_.add(code);
else
this.languagesToAdd_.delete(code);
this.disableActionButton_ = !this.languagesToAdd_.size;
},
/** @private */
onCancelButtonTap_: function() {
this.$.dialog.close();
},
/**
* Enables the checked languages.
* @private
*/
onActionButtonTap_: function() {
this.$.dialog.close();
for (var languageCode of this.languagesToAdd_)
this.languageHelper.enableLanguage(languageCode);
},
});
chrome/browser/resources/settings/languages_page/compiled_resources2.gyp
View file @ 9a670d48
......@@ -65,7 +65,7 @@
'includes': ['../../../../../third_party/closure_compiler/compile_js2.gypi'],
},
{
'target_name': 'manage_languages_page',
'target_name': 'add_languages_dialog',
'dependencies': [
'<(DEPTH)/third_party/polymer/v1_0/components-chromium/paper-checkbox/compiled_resources2.gyp:paper-checkbox-extracted',
'languages',
......
chrome/browser/resources/settings/languages_page/languages_page.html
View file @ 9a670d48
......@@ -13,9 +13,9 @@
<link rel="import" href="/settings_page/settings_animated_pages.html">
<link rel="import" href="/settings_page/settings_subpage.html">
<link rel="import" href="/settings_shared_css.html">
<link rel="import" href="add_languages_dialog.html">
<link rel="import" href="language_detail_page.html">
<link rel="import" href="languages.html">
<link rel="import" href="manage_languages_page.html">
<if expr="not is_macosx">
<link rel="import" href="edit_dictionary_page.html">
......@@ -37,8 +37,7 @@
</settings-languages>
<settings-animated-pages id="pages" section="languages">
<neon-animatable route-path="default">
<div id="manage-languages-subpage-trigger"
class="settings-box first two-line">
<div class="settings-box first two-line">
<div class="start">
<div>$i18n{languagesListTitle}</div>
<div class="secondary">
......@@ -104,12 +103,17 @@
on-tap="onShowLanguageDetailTap_">
$i18n{languageDetail}
</button>
<button class="dropdown-item" role="option"
on-tap="onRemoveLanguageTap_"
disabled="[[!item.removable]]">
$i18n{removeLanguage}
</button>
</div>
</iron-dropdown>
</div>
</template>
<div class="list-item list-button" on-tap="onManageLanguagesTap_">
$i18n{manageLanguages}
<div class="list-item list-button" on-tap="onAddLanguagesTap_">
$i18n{addLanguages}
</div>
</div>
</iron-collapse>
......@@ -190,16 +194,6 @@
</iron-collapse>
</if>
</neon-animatable>
<template is="dom-if" route-path="/manageLanguages">
<settings-subpage
associated-control="[[$$('#manage-languages-subpage-trigger')]]"
page-title="$i18n{manageLanguagesPageTitle}">
<settings-manage-languages-page
languages="{{languages}}" prefs="{{prefs}}"
language-helper="[[languageHelper]]">
</settings-manage-languages-page>
</settings-subpage>
</template>
<template is="dom-if" route-path="/languages/edit" no-search>
<settings-subpage page-title="[[detailLanguage_.language.displayName]]">
<settings-language-detail-page id="languageDetailPage"
......@@ -229,6 +223,11 @@
</template>
</if>
</settings-animated-pages>
<template is="dom-if" if="[[showAddLanguagesDialog_]]" restamp>
<settings-add-languages-dialog languages="{{languages}}"
language-helper="[[languageHelper]]">
</settings-add-languages-dialog>
</template>
</template>
<script src="languages_page.js"></script>
</dom-module>
chrome/browser/resources/settings/languages_page/languages_page.js
View file @ 9a670d48
......@@ -46,6 +46,9 @@ Polymer({
* @private
*/
detailLanguage_: Object,
/** @private */
showAddLanguagesDialog_: Boolean,
},
/**
......@@ -89,12 +92,18 @@ Polymer({
},
/**
* Opens the Manage Languages page.
* Stamps and opens the Add Languages dialog, registering a listener to
* disable the dialog's dom-if again on close.
* @private
*/
onManageLanguagesTap_: function() {
settings.navigateTo(settings.Route.MANAGE_LANGUAGES);
this.forceRenderList_('settings-manage-languages-page');
onAddLanguagesTap_: function() {
this.showAddLanguagesDialog_ = true;
this.async(function() {
var dialog = this.$$('settings-add-languages-dialog');
dialog.addEventListener('close', function() {
this.showAddLanguagesDialog_ = false;
}.bind(this));
});
},
/**
......@@ -145,6 +154,15 @@ Polymer({
this.languageHelper.moveLanguage(e.model.item.language.code, 1);
},
/**
* Disables the language.
* @param {!{model: !{item: !LanguageState}}} e
* @private
*/
onRemoveLanguageTap_: function(e) {
this.languageHelper.disableLanguage(e.model.item.language.code);
},
/**
* Opens the Language Detail page for the language.
* @param {!{model: !{item: !LanguageState}}} e
......
chrome/browser/resources/settings/languages_page/manage_languages_page.html deleted 100644 → 0
View file @ 449e2fc9
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/html/assert.html">
<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-list/iron-list.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-checkbox/paper-checkbox.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
<link rel="import" href="/settings_shared_css.html">
<link rel="import" href="languages.html">
<dom-module id="settings-manage-languages-page">
<template>
<style include="settings-shared">
.list-frame {
align-items: initial;
display: flex;
flex-direction: column;
}
iron-list {
height: 300px;
}
.ripple-padding {
/* Create a little extra space for checkbox ink ripple to flow into. */
left: -20px;
padding-left: 20px;
}
</style>
<div class="settings-box first block">
<h2>$i18n{enabledLanguages}</h2>
<div class="list-frame vertical-list">
<template is="dom-repeat" items="{{languages.enabled}}">
<div class="list-item">
<div class="start" title="[[item.language.nativeDisplayName]]">
[[item.language.displayName]]
</div>
<paper-icon-button icon="cr:clear"
on-tap="onRemoveLanguageTap_" hidden$="[[!item.removable]]">
</paper-icon-button>
</div>
</template>
</div>
<h2>$i18n{allLanguages}</h2>
<div class="list-frame vertical-list">
<iron-list class="ripple-padding" items="{{languages.supported}}">
<template>
<div class="list-item">
<paper-checkbox
checked="[[isCheckboxChecked_(item, languages.enabled.*)]]"
disabled="[[isLanguageRequired_(item, languages.enabled.*)]]"
title$="[[item.nativeDisplayName]]"
on-change="onLanguageCheckboxChange_">
[[item.displayName]]
</paper-checkbox>
</div>
</template>
</iron-list>
</div>
</div>
</template>
<script src="manage_languages_page.js"></script>
</dom-module>
chrome/browser/resources/settings/languages_page/manage_languages_page.js deleted 100644 → 0
View file @ 449e2fc9
// Copyright 2015 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
/**
* @fileoverview 'settings-manage-languages-page' is a sub-page for enabling
* and disabling languages.
*/
Polymer({
is: 'settings-manage-languages-page',
properties: {
/**
* Preferences state.
*/
prefs: {
type: Object,
notify: true,
},
/**
* @type {!LanguagesModel|undefined}
*/
languages: {
type: Object,
notify: true,
},
/** @type {!LanguageHelper} */
languageHelper: Object,
},
/**
* @param {!chrome.languageSettingsPrivate.Language} language
* @param {!Object} change Polymer change object (provided in the HTML so this
* gets called whenever languages.enabled.* changes).
* @return {boolean}
* @private
*/
isCheckboxChecked_: function(language, change) {
return this.languageHelper.isLanguageEnabled(language.code);
},
/**
* Determines whether a language must be enabled. If so, the checkbox in the
* available languages list should not be changeable.
* @param {!chrome.languageSettingsPrivate.Language} language
* @param {!Object} change Polymer change object (provided in the HTML so this
* gets called whenever languages.enabled.* changes).
* @return {boolean}
* @private
*/
isLanguageRequired_: function(language, change) {
// This check only applies to enabled languages.
if (!this.languageHelper.isLanguageEnabled(language.code))
return false;
return !this.languageHelper.canDisableLanguage(language.code);
},
/**
* Handler for removing a language.
* @param {!{model: !{item: !LanguageState}}} e
* @private
*/
onRemoveLanguageTap_: function(e) {
this.languageHelper.disableLanguage(e.model.item.language.code);
},
/**
* Handler for checking or unchecking a language item.
* @param {!{model: !{item: !chrome.languageSettingsPrivate.Language},
* target: !PaperCheckboxElement}} e
* @private
*/
onLanguageCheckboxChange_: function(e) {
var code = e.model.item.code;
if (e.target.checked)
this.languageHelper.enableLanguage(code);
else
this.languageHelper.disableLanguage(code);
},
});
chrome/browser/resources/settings/route.js
View file @ 9a670d48
......@@ -174,7 +174,6 @@ cr.define('settings', function() {
r.LANGUAGES = r.ADVANCED.createSection('/languages', 'languages');
r.LANGUAGES_DETAIL = r.LANGUAGES.createChild('edit');
r.MANAGE_LANGUAGES = r.LANGUAGES.createChild('/manageLanguages');
<if expr="chromeos">
r.INPUT_METHODS = r.LANGUAGES.createChild('/inputMethods');
</if>
......
chrome/browser/resources/settings/settings_resources.grd
View file @ 9a670d48
......@@ -506,6 +506,12 @@
type="chrome_html"
flattenhtml="true"
allowexternalscript="true" />
<structure name="IDR_SETTINGS_LANGUAGES_ADD_LANGUAGES_DIALOG_HTML"
file="languages_page/add_languages_dialog.html"
type="chrome_html" />
<structure name="IDR_SETTINGS_LANGUAGES_ADD_LANGUAGES_DIALOG_JS"
file="languages_page/add_languages_dialog.js"
type="chrome_html" />
<structure name="IDR_SETTINGS_LANGUAGES_PAGE_HTML"
file="languages_page/languages_page.html"
type="chrome_html"
......@@ -524,12 +530,6 @@
file="languages_page/manage_input_methods_page.js"
type="chrome_html" />
</if>
<structure name="IDR_SETTINGS_LANGUAGES_MANAGE_LANGUAGES_PAGE_HTML"
file="languages_page/manage_languages_page.html"
type="chrome_html" />
<structure name="IDR_SETTINGS_LANGUAGES_MANAGE_LANGUAGES_PAGE_JS"
file="languages_page/manage_languages_page.js"
type="chrome_html" />
<structure name="IDR_SETTINGS_LANGUAGES_LANGUAGE_DETAIL_PAGE_HTML"
file="languages_page/language_detail_page.html"
type="chrome_html"
......
chrome/browser/resources/settings/settings_shared_css.html
View file @ 9a670d48
......@@ -75,11 +75,15 @@
box-shadow: 0 2px 6px var(--paper-grey-500);
}
iron-dropdown .dropdown-content .dropdown-item,
iron-dropdown .dropdown-content .dropdown-item:not([disabled]),
iron-dropdown .dropdown-content paper-item {
@apply(--settings-actionable);
}
iron-dropdown .dropdown-content .dropdown-item[disabled] {
opacity: var(--settings-disabled-opacity);
}
span ~ a {
-webkit-margin-start: 4px;
}
......@@ -225,7 +229,7 @@
}
.list-item > label span[disabled] {
opacity: .65; /* TODO(michaelpg): check this value with bettes. */
opacity: var(--settings-disabled-opacity);
}
.list-item > paper-icon-item {
......
chrome/browser/resources/settings/settings_vars_css.html
View file @ 9a670d48
......@@ -33,6 +33,7 @@
font-weight: 400;
margin-top: 4px;
};
--settings-disabled-opacity: .65;
--settings-error-color: var(--paper-red-700);
--settings-list-frame-padding: {
......
chrome/browser/ui/webui/settings/md_settings_localized_strings_provider.cc
View file @ 9a670d48
......@@ -693,9 +693,10 @@ void AddLanguagesStrings(content::WebUIDataSource* html_source) {
IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_ORDERING_INSTRUCTIONS},
{"moveUp", IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_MOVE_UP},
{"moveDown", IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_MOVE_DOWN},
{"removeLanguage", IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_REMOVE},
{"languageDetail",
IDS_SETTINGS_LANGUAGES_LANGUAGES_LIST_LANGUAGE_DETAIL},
{"manageLanguages", IDS_SETTINGS_LANGUAGES_LANGUAGES_MANAGE},
{"addLanguages", IDS_SETTINGS_LANGUAGES_LANGUAGES_ADD},
#if defined(OS_CHROMEOS)
{"inputMethodsListTitle",
IDS_SETTINGS_LANGUAGES_INPUT_METHODS_LIST_TITLE},
......@@ -703,7 +704,7 @@ void AddLanguagesStrings(content::WebUIDataSource* html_source) {
{"manageInputMethodsPageTitle",
IDS_SETTINGS_LANGUAGES_MANAGE_INPUT_METHODS_TITLE},
#endif
{"manageLanguagesPageTitle",
{"addLanguagesDialogTitle",
IDS_SETTINGS_LANGUAGES_MANAGE_LANGUAGES_TITLE},
{"allLanguages", IDS_SETTINGS_LANGUAGES_ALL_LANGUAGES},
{"enabledLanguages", IDS_SETTINGS_LANGUAGES_ENABLED_LANGUAGES},
......
chrome/test/data/webui/settings/languages_page_browsertest.js
View file @ 9a670d48
......@@ -51,6 +51,32 @@ TEST_F('SettingsLanguagesPageBrowserTest', 'MAYBE_LanguagesPage', function() {
var languagesSection;
var languagesPage;
var languageHelper;
/**
* @param {numExpected} Expected number of languages to eventually be
* enabled.
* @return {!Promise} Resolved when the number of enabled languages changes
* to match expectations.
*/
function whenNumEnabledLanguagesBecomes(numExpected) {
assert(!!languagesPage);
return new Promise(function(resolve, reject) {
languagesPage.addEventListener('languages-changed', function changed() {
if (languagesPage.languages.enabled.length != numExpected)
return;
resolve();
languagesPage.removeEventListener('languages-changed', changed);
});
});
}
// Returns a supported language that is not enabled, for testing.
function getAvailableLanguage() {
return languagesPage.languages.supported.find(function(language) {
return !languageHelper.isLanguageEnabled(language.code);
});
}
suiteSetup(function() {
advanced.set('pageVisibility.languages', true);
Polymer.dom.flush();
......@@ -67,19 +93,101 @@ TEST_F('SettingsLanguagesPageBrowserTest', 'MAYBE_LanguagesPage', function() {
teardown(function(done) {
// Close the section if we're in a sub-page.
if (settings.getCurrentRoute().isSubpage()) {
settings.navigateTo(settings.Route.ADVANCED);
settings.navigateTo(settings.Route.BASIC);
setTimeout(done);
} else {
done();
}
});
test('manage languages', function() {
var manageLanguagesButton =
languagesPage.$.languagesCollapse.querySelector(
'.list-button:last-of-type');
MockInteractions.tap(manageLanguagesButton);
assertTrue(!!languagesPage.$$('settings-manage-languages-page'));
suite('add languages dialog', function() {
var dialog;
var dialogItems;
var cancelButton;
var actionButton;
setup(function(done) {
var addLanguagesButton = languagesPage.$.languagesCollapse
.querySelector('.list-button:last-of-type');
MockInteractions.tap(addLanguagesButton);
// The page stamps the dialog and registers listeners asynchronously.
Polymer.Base.async(function() {
dialog = languagesPage.$$('settings-add-languages-dialog');
assertTrue(!!dialog);
actionButton = assert(dialog.$$('.action-button'));
cancelButton = assert(dialog.$$('.cancel-button'));
// The fixed-height dialog's iron-list should stamp far fewer than
// 50 items.
dialogItems =
dialog.$.dialog.querySelectorAll('.list-item:not([hidden])');
assertGT(dialogItems.length, 1);
assertLT(dialogItems.length, 50);
// No languages have been checked, so the action button is disabled.
assertTrue(actionButton.disabled);
assertFalse(cancelButton.disabled);
done();
});
});
// After every test, check that the dialog is removed from the DOM.
teardown(function() {
Polymer.dom.flush();
assertEquals(null, languagesPage.$$('settings-add-languages-dialog'));
});
test('cancel', function() {
// Canceling the dialog should close and remove it.
MockInteractions.tap(cancelButton);
});
test('add languages and cancel', function(done) {
var numEnabled = languagesPage.languages.enabled.length;
// Check some languages.
MockInteractions.tap(dialogItems[0]);
MockInteractions.tap(dialogItems[1]);
// Canceling the dialog should close and remove it without enabling
// the checked languages. A small timeout lets us check this.
MockInteractions.tap(cancelButton);
setTimeout(function() {
// Number of enabled languages should be the same.
assertEquals(numEnabled, languagesPage.languages.enabled.length);
done();
}, 100);
});
test('add languages and confirm', function() {
var numEnabled = languagesPage.languages.enabled.length;
// No languages have been checked, so the action button is inert.
MockInteractions.tap(actionButton);
Polymer.dom.flush();
assertEquals(dialog, languagesPage.$$('settings-add-languages-dialog'));
// Check and uncheck one language.
MockInteractions.tap(dialogItems[0]);
assertFalse(actionButton.disabled);
MockInteractions.tap(dialogItems[0]);
assertTrue(actionButton.disabled);
// Check multiple languages.
MockInteractions.tap(dialogItems[0]);
MockInteractions.tap(dialogItems[1]);
assertFalse(actionButton.disabled);
// The action button should close and remove the dialog, enabling the
// checked languages.
MockInteractions.tap(actionButton);
// Wait for the languages to be enabled by the browser.
return whenNumEnabledLanguagesBecomes(numEnabled + 2);
});
});
test('Should not set UI language', function() {
......@@ -94,6 +202,42 @@ TEST_F('SettingsLanguagesPageBrowserTest', 'MAYBE_LanguagesPage', function() {
MockInteractions.tap(languageOptionsDropdownTrigger);
});
test('remove language', function() {
var numEnabled = languagesPage.languages.enabled.length;
// Enabled a language which we can then disable.
var newLanguage = getAvailableLanguage();
languageHelper.enableLanguage(newLanguage.code);
// Wait for the language to be enabled.
return whenNumEnabledLanguagesBecomes(numEnabled + 1).then(function() {
// Populate the dom-repeat.
Polymer.dom.flush();
// Find the new language item.
var languagesCollapse = languagesPage.$.languagesCollapse;
var items = languagesCollapse.querySelectorAll('.list-item');
var domRepeat = assert(
languagesCollapse.querySelector('template[is="dom-repeat"]'));
var item = Array.from(items).find(function(el) {
return domRepeat.itemForElement(el) &&
domRepeat.itemForElement(el).language == newLanguage;
});
// Open the menu and select Remove.
MockInteractions.tap(item.querySelector('paper-icon-button'));
var removeMenuItem = assert(item.querySelector(
'.dropdown-content .dropdown-item:last-of-type'));
assertFalse(removeMenuItem.disabled);
MockInteractions.tap(removeMenuItem);
// We should go back down to the original number of enabled languages.
return whenNumEnabledLanguagesBecomes(numEnabled).then(function() {
assertFalse(languageHelper.isLanguageEnabled(newLanguage.code));
});
});
});
test('language detail', function() {
var languagesCollapse = languagesPage.$.languagesCollapse;
var languageDetailMenuItem = languagesCollapse.querySelectorAll(
......
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