{"action":"created","issue":{"url":"https://api.github.com/repos/emberjs/ember.js/issues/12524","labels_url":"https://api.github.com/repos/emberjs/ember.js/issues/12524/labels{/name}","comments_url":"https://api.github.com/repos/emberjs/ember.js/issues/12524/comments","events_url":"https://api.github.com/repos/emberjs/ember.js/issues/12524/events","html_url":"https://github.com/emberjs/ember.js/issues/12524","id":113583664,"number":12524,"title":"Helper returning Ember.String.htmlSafe string passes unit tests in Chrome but fails in PhantomJS","user":{"login":"adam-knights","id":12710362,"avatar_url":"https://avatars.githubusercontent.com/u/12710362?v=3","gravatar_id":"","url":"https://api.github.com/users/adam-knights","html_url":"https://github.com/adam-knights","followers_url":"https://api.github.com/users/adam-knights/followers","following_url":"https://api.github.com/users/adam-knights/following{/other_user}","gists_url":"https://api.github.com/users/adam-knights/gists{/gist_id}","starred_url":"https://api.github.com/users/adam-knights/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/adam-knights/subscriptions","organizations_url":"https://api.github.com/users/adam-knights/orgs","repos_url":"https://api.github.com/users/adam-knights/repos","events_url":"https://api.github.com/users/adam-knights/events{/privacy}","received_events_url":"https://api.github.com/users/adam-knights/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-10-27T13:30:48Z","updated_at":"2015-10-27T14:31:19Z","closed_at":"2015-10-27T14:31:19Z","body":"I've created a twiddle that shows the functionality of my helper: http://ember-twiddle.com/36566222df480f247ca5\r\n\r\nGiven a large string, and a smaller string, it bolds any occurrences of the smaller string in the larger string, i.e. `{{auto-complete-emphasizer 'Robin and Batman' 'bat'}}` returns `Robin and <b>Bat</b>man`.\r\n\r\nWhen I run the auto-complete-emphasizer's unit tests in chrome, they all pass. When they run through phantomjs via `ember test > results.tap` they fail. Instead of returning a string, `Ember.String.htmlSafe` returns `[object Object]`.\r\n\r\nHere is the tests/unit/helpers/auto-complete-emphasizer-test.js file:\r\n\r\n```\r\nimport { autoCompleteEmphasizer } from '../../../helpers/auto-complete-emphasizer';\r\nimport { module, test } from 'qunit';\r\n\r\nmodule('Unit | Helper | auto complete emphasizer');\r\n\r\ntest('emphasizes one word correctly from a single search word and defaults to bold', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'In the end Batman is no longer afraid of bats';\r\n  var searchText = 'batman';\r\n  var expected = 'In the end <b>Batman</b> is no longer afraid of bats';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText]);\r\n  assert.equal(result, expected);\r\n});\r\n\r\ntest('using a non default emphasizer works', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'In the end Batman is no longer afraid of bats';\r\n  var searchText = 'batman';\r\n  var emphasisElement = 'empher';\r\n  var expected = 'In the end <empher>Batman</empher> is no longer afraid of bats';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText, emphasisElement]);\r\n  assert.equal(result, expected);\r\n});\r\n\r\ntest('emphasizes multiple words correctly from a single search word', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'In the end Batman is no longer afraid of bats';\r\n  var searchText = 'bat';\r\n  var expected = 'In the end <b>Bat</b>man is no longer afraid of <b>bat</b>s';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText]);\r\n  assert.equal(result, expected);\r\n});\r\n\r\ntest('emphasizes multiple words correctly from a multiple search words', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'Tick tock went the clock';\r\n  var searchText = 'ck ent';\r\n  var expected = 'Ti<b>ck</b> to<b>ck</b> w<b>ent</b> the clo<b>ck</b>';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText]);\r\n  assert.equal(result, expected);\r\n});\r\n\r\ntest('space at end of search text does not effect result', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'In the end Batman is no longer afraid of bats';\r\n  var searchText = 'batman ';\r\n  var expected = 'In the end <b>Batman</b> is no longer afraid of bats';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText]);\r\n  assert.equal(result, expected);\r\n});\r\n\r\ntest('search word equal to emphasizer works', function(assert) {\r\n  assert.expect(1);\r\n\r\n  var inputString = 'Building Supplies';\r\n  var searchText = 's b';\r\n  var expected = '<b>B</b>uilding <b>S</b>upplie<b>s</b>';\r\n\r\n  var result = autoCompleteEmphasizer([inputString, searchText]);\r\n  assert.equal(result, expected);\r\n});\r\n```\r\n\r\nAnd the helper itself to save you taking it from the twiddle:\r\n\r\n```\r\nimport Ember from 'ember';\r\n\r\n// Inputs\r\n// params[0] - Text to add emphasis parts too\r\n// params[1] - searchText to use in emphasizing\r\n// params[2] - (Optional) Emphasizing element i.e. i for <i>, defaults to <b>\r\n\r\nexport function autoCompleteEmphasizer(params) {\r\n  if (params === undefined || params === null || params.length === 0) {\r\n    return false;\r\n  }\r\n\r\n  var result = params[0];\r\n\r\n  // If they only provide the string to search in then return it unaltered\r\n  if (params.length === 1) {\r\n    return result;\r\n  }\r\n\r\n  var searchText = params[1].toLowerCase().replace(/\\(|\\)/g, '');\r\n  if (searchText.length === 0) {\r\n    return result;\r\n  }\r\n\r\n  // Get search words and make sure search wordsare unique and non empty\r\n  var searchWords = searchText.split(' ').uniq().reject(w => w === '');\r\n\r\n  var emphasisElement = params[2] || 'b';\r\n\r\n  // If any of the search words match the emphasis element then do that word first\r\n  if (searchWords.contains(emphasisElement)) {\r\n    searchWords.removeObject(emphasisElement);\r\n    searchWords.insertAt(0, emphasisElement);\r\n  }\r\n\r\n  // Make sure result is html safe and contains nothing malicious\r\n  result = Ember.Handlebars.Utils.escapeExpression(result);\r\n\r\n  searchWords.forEach(w => result = result.replace(new RegExp('(^|)(' + w + ')(|$)','ig'), '$1<' + emphasisElement + '>$2</' + emphasisElement + '>$3'));\r\n\r\n  // Make result as html safe as we know it contains no malicious html\r\n  return Ember.String.htmlSafe(result);\r\n}\r\n\r\nexport default Ember.Helper.helper(autoCompleteEmphasizer);\r\n```\r\n\r\nI am unsure if this is a Ember issue in String.htmlSafe? Or something like a Ember Qunit issue, or PhantomJS?"},"comment":{"url":"https://api.github.com/repos/emberjs/ember.js/issues/comments/151517700","html_url":"https://github.com/emberjs/ember.js/issues/12524#issuecomment-151517700","issue_url":"https://api.github.com/repos/emberjs/ember.js/issues/12524","id":151517700,"user":{"login":"adam-knights","id":12710362,"avatar_url":"https://avatars.githubusercontent.com/u/12710362?v=3","gravatar_id":"","url":"https://api.github.com/users/adam-knights","html_url":"https://github.com/adam-knights","followers_url":"https://api.github.com/users/adam-knights/followers","following_url":"https://api.github.com/users/adam-knights/following{/other_user}","gists_url":"https://api.github.com/users/adam-knights/gists{/gist_id}","starred_url":"https://api.github.com/users/adam-knights/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/adam-knights/subscriptions","organizations_url":"https://api.github.com/users/adam-knights/orgs","repos_url":"https://api.github.com/users/adam-knights/repos","events_url":"https://api.github.com/users/adam-knights/events{/privacy}","received_events_url":"https://api.github.com/users/adam-knights/received_events","type":"User","site_admin":false},"created_at":"2015-10-27T14:31:19Z","updated_at":"2015-10-27T14:31:19Z","body":"Thanks @rwjblue that has solved the object issue. Obvious now you've pointed it out. I have a remaining issue in that the regex in the line `searchWords.forEach(w => result = result.replace(new RegExp('(^|)(' + w + ')(|$)','ig'), '$1<' + emphasisElement + '>$2</' + emphasisElement + '>$3'));` doesn't work in phantom JS but does in Chrome. I am pretty sure this will be unrelated to Ember so I will close this. Thanks again."}}