MD Settings: add empty list message for spell-check edit page.

chrome/browser/resources/settings/languages_page/edit_dictionary_page.js

 // 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-edit-dictionary-page' is a sub-page for editing
  * the "dictionary" of custom words used for spell check.
  */
 Polymer({
   is: 'settings-edit-dictionary-page',
 
   properties: {
     /** @private {string} */
     newWordValue_: String,
 
     /** @private {!Array<string>} */
     words_: {
       type: Array,
       value: function() { return []; },
     },
   },
 
+  /** @type {LanguageSettingsPrivate} */
+  languageSettingsPrivate: null,
+
   ready: function() {
-    chrome.languageSettingsPrivate.getSpellcheckWords(function(words) {

[scottchen, 2017/02/15 19:34:45]

This change is needed so that the languageSettingsPrivate can be spoofed during
test.

+    this.languageSettingsPrivate =
+        settings.languageSettingsPrivateApiForTest ||
+        /** @type {!LanguageSettingsPrivate} */(chrome.languageSettingsPrivate);
+
+    this.languageSettingsPrivate.getSpellcheckWords(function(words) {
       this.words_ = words;
     }.bind(this));
 
     // Updates are applied locally so they appear immediately, but we should
     // listen for changes in case they come from elsewhere.
-    chrome.languageSettingsPrivate.onCustomDictionaryChanged.addListener(
+    this.languageSettingsPrivate.onCustomDictionaryChanged.addListener(
         this.onCustomDictionaryChanged_.bind(this));
 
     // Add a key handler for the paper-input.
     this.$.keys.target = this.$.newWord;
   },
 
   /**
    * Check if the new word text-field is empty.
    * @private
    * @param {string} value
@@ skipping 37 matching lines @@
   onAddWordTap_: function(e) {
     this.addWordFromInput_();
     this.$.newWord.focus();
   },
 
   /**
    * Handles tapping on a paper-item's Remove Word icon button.
    * @param {!{model: !{item: string}}} e
    */
   onRemoveWordTap_: function(e) {
-    chrome.languageSettingsPrivate.removeSpellcheckWord(e.model.item);
+    this.languageSettingsPrivate.removeSpellcheckWord(e.model.item);
     this.arrayDelete('words_', e.model.item);
   },
 
   /**
    * Adds the word in the paper-input to the dictionary, also appending it
    * to the end of the list of words shown to the user.
    */
   addWordFromInput_: function() {
     // Spaces are allowed, but removing leading and trailing whitespace.
     var word = this.newWordValue_.trim();
     this.newWordValue_ = '';
     if (!word)
       return;
 
     var index = this.words_.indexOf(word);

[dpapad, 2017/02/15 20:36:37]

Unrelated to your fix: I hope real users don't have too many words. Otherwise
linear search is not the best choice here.

[scottchen, 2017/02/22 21:42:25]

Acknowledged.

     if (index == -1) {
-      chrome.languageSettingsPrivate.addSpellcheckWord(word);
+      this.languageSettingsPrivate.addSpellcheckWord(word);
       this.push('words_', word);
+      index = this.words_.length - 1;

[scottchen, 2017/02/15 19:34:46]

This was not scrolling to the bottom correctly

     }
 
     // Scroll to the word (usually the bottom, or to the index if the word
     // is already present).
-    this.$.list.scrollToIndex(index);
+    this.async(function(){

[scottchen, 2017/02/15 19:34:46]

With the list being in a dom-if now, this would need to be async to give it time
to show up in the dom.

+      this.root.querySelector('#list').scrollToIndex(index);
+    });
   },
+
+  /**
+   * Checks if any words exists in the dictionary.
+   * @private
+   * @return {!boolea}

[dpapad, 2017/02/15 20:36:37]

Typo (should cause compilation error).

[scottchen, 2017/02/22 21:42:25]

Done.

+   */
+  hasWords_: function() {
+    return !!(this.words_ && this.words_.length);

[dpapad, 2017/02/15 20:36:37]

words_ is initialized to the empty array. Why do we need to check if it exists?

[scottchen, 2017/02/22 21:42:25]

I was thinking just in case languageSettingsPrivate.getSpellcheckWords(cb) calls
cb with null or undefined for whatever reason (or in the future). Or do you
think its not necessary to pre-error-prevent?

[dpapad, 2017/02/22 21:58:52]

I don't think this is necessary to be defensive in that way. The JSDoc at [1],
should be reflecting the implementation, and therefore no null/undefined should
be returned. We are defensive by trusting the JSDoc and the JSCompiler to catch
errors.

[1]
https://cs.chromium.org/chromium/src/third_party/closure_compiler/externs/lan...

[dpapad, 2017/02/23 00:32:03]

Ping ^. Can we remove the check for this.words_? Then you can probably get rid
of hasWords_() helper completely and directly use words_.length in the binding.

[scottchen, 2017/02/23 01:00:17]

It appears that I cannot to [[!!boolean]] in template so I think I still need a
middleman function. Removed the null check.

+  }
 });