Merge pull request #191 from antidis/antidis/search-bug-fix

Fix bug where the token separators used in the search component and the search indexer were inconsistent

Author: dfreeman

addon/components/docs-header/search-box/template.hbs

@@ -12,5 +12,6 @@
     type="text"
     placeholder='Search'
     class='w-24 text-xs p-2 pl-6 rounded focus:bg-grey-lighter outline-none'
-    data-search-box-input>
+    data-search-box-input
+    data-test-search-box-input>
 </div>

addon/components/docs-header/search-result/component.js

@@ -81,5 +81,7 @@ export default Component.extend({
 
   _highlight(text, start, length) {
     return `${text.slice(0, start)}<em class='docs-viewer-search__result-item__text--emphasis'>${text.slice(start, start + length)}</em>${text.slice(start + length)}`;
-  }
+  },
+
+  'data-test-search-result': true,
 });

addon/components/docs-header/search-results/template.hbs

@@ -6,7 +6,7 @@
     onClose=(action 'clearSearch')
     targetAttachment='bottom left'
     constraints=(array (hash to='window' attachment='together' pin=true))}}
-    <ul class="docs-viewer-search__result-list">
+    <ul class="docs-viewer-search__result-list" data-test-search-result-list>
       {{#each (take 5 searchResults) as |result index|}}
         <li>
           {{docs-header/search-result

addon/services/docs-search.js

@@ -2,6 +2,7 @@ import Service, { inject as service } from '@ember/service';
 import { getOwner } from '@ember/application';
 import { computed } from '@ember/object';
 import lunr from 'lunr';
+import config from 'dummy/config/environment';
 
 const { Index, Query } = lunr;
 
@@ -11,7 +12,7 @@ export default Service.extend({
   search(phrase) {
     return this.loadSearchIndex()
       .then(({ index, documents }) => {
-        let words = phrase.toLowerCase().split(/\s+/);
+        let words = phrase.toLowerCase().split(new RegExp(config['ember-cli-addon-docs'].searchTokenSeparator));
         let results = index.query((query) => {
           // In the future we could boost results based on the field they come from
           for (let word of words) {

index.js

@@ -47,7 +47,8 @@ module.exports = {
         projectName: this.parent.pkg.name,
         projectTag: this.parent.pkg.version,
         projectHref: info && info.browse(),
-        deployVersion: 'ADDON_DOCS_DEPLOY_VERSION'
+        deployVersion: 'ADDON_DOCS_DEPLOY_VERSION',
+        searchTokenSeparator: "\\s+"
       }
     };
 

lib/broccoli/search-indexer.js

@@ -27,6 +27,8 @@ module.exports = class SearchIndexCompiler extends Writer {
       this.field('text');
       this.field('keywords');
 
+      this.tokenizer.separator = new RegExp(writer.config['ember-cli-addon-docs'].searchTokenSeparator);
+
       for (let doc of writer.buildDocuments()) {
         if (doc) {
           documents[doc.id] = doc;

tests/acceptance/sandbox/api/components-test.js

@@ -45,4 +45,12 @@ module('Acceptance | API | components', function(hooks) {
     assert.equal(indexItems.length, 13, 'correct number of items rendered');
     assert.ok(indexItems.includes('_privateField'), 'private field rendered');
   });
+
+  test('search box works', async function(assert) {
+    await visit('/sandbox');
+
+    assert.equal(modulePage.searchResults.items.length, 0, 'no search results shown');
+    await modulePage.fillInSearchQuery('sub-subsection');
+    assert.equal(modulePage.searchResults.items.length, 1, 'one search result shown');
+  });
 });

tests/pages/api/class.js

@@ -1,6 +1,7 @@
-import PageObject, { collection, text } from 'ember-classy-page-object';
+import BaseAddonPage from '../base';
+import { collection, text } from 'ember-classy-page-object';
 
-const ClassPage = PageObject.extend({
+const ClassPage = BaseAddonPage.extend({
   navItems: collection({ scope: '[data-test-id="nav-item"]' }),
 
   title: text('[data-test-class-name]'),

tests/pages/api/module.js

@@ -1,6 +1,7 @@
-import PageObject, { collection, text } from 'ember-classy-page-object';
+import BaseAddonPage from '../base';
+import { collection, text } from 'ember-classy-page-object';
 
-const ModulePage = PageObject.extend({
+const ModulePage = BaseAddonPage.extend({
   navItems: collection({ scope: '[data-test-id="nav-item"]' }),
 
   toggles: collection({

tests/pages/base.js

@@ -0,0 +1,15 @@
+import PageObject, { collection, fillable } from 'ember-classy-page-object';
+
+const DefaultPage = PageObject.extend({
+  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
+  fillInSearchQuery: fillable('[data-test-search-box-input]'),
+  // eslint-disable-next-line ember/avoid-leaking-state-in-ember-objects
+  searchResults: {
+    scope: '[data-test-search-result-list]',
+    items: collection({
+      scope: '[data-test-search-result]'
+    })
+  }
+});
+
+export default DefaultPage;