{"action":"created","issue":{"url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/16933","repository_url":"https://api.github.com/repos/LeaVerou/awesomplete","labels_url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/16933/labels{/name}","comments_url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/16933/comments","events_url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/16933/events","html_url":"https://github.com/LeaVerou/awesomplete/issues/16933","id":171853046,"number":16933,"title":"Highlight (with html mark element) only the text at the start when FILTER_STARTSWITH is used.","user":{"login":"nico-amsterdam","id":16443840,"avatar_url":"https://avatars.githubusercontent.com/u/16443840?v=3","gravatar_id":"","url":"https://api.github.com/users/nico-amsterdam","html_url":"https://github.com/nico-amsterdam","followers_url":"https://api.github.com/users/nico-amsterdam/followers","following_url":"https://api.github.com/users/nico-amsterdam/following{/other_user}","gists_url":"https://api.github.com/users/nico-amsterdam/gists{/gist_id}","starred_url":"https://api.github.com/users/nico-amsterdam/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nico-amsterdam/subscriptions","organizations_url":"https://api.github.com/users/nico-amsterdam/orgs","repos_url":"https://api.github.com/users/nico-amsterdam/repos","events_url":"https://api.github.com/users/nico-amsterdam/events{/privacy}","received_events_url":"https://api.github.com/users/nico-amsterdam/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2016-08-18T09:07:29Z","updated_at":"2016-08-21T08:45:06Z","closed_at":null,"body":"With javascript I create an Awesomplete object with filter starts-with: \r\n`{filter: Awesomplete.FILTER_STARTSWITH, maxItems: 10, minChars: 1}`\r\n\r\nSuppose I have an item 'Sports & Automotive' and the end-user searches for 's', both the first 's' and second 's' will be highlighted, suggesting to the end-user that the search-result is based on all items that contain text with an 's'.  \r\n\r\nACTUAL:\r\nThe produced DOM is:\r\n  `<li aria-selected=\"false\"><mark>S</mark>port<mark>s</mark> &amp; Automotive</li>`\r\n\r\nDESIRED:\r\nIs there a way to get only this DOM when FILTER_STARTSWITH is used?\r\n  `<li aria-selected=\"false\"><mark>S</mark>ports &amp; Automotive</li>`\r\n\r\nWORKAROUND:\r\nThere is a workaround, but it is based on hiding the standard behavior with CSS instead of correcting the DOM.\r\n1) Surround the input-tags that use the start-with filter with `<span class=\"starts-with\">   </span>`\r\n2) Add this style in the HTML header:\r\n `<style>.starts-with div.awesomplete mark:not(:first-child) {background: none; color:#333; padding:0;}</style>`\r\n"},"comment":{"url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/comments/241245918","html_url":"https://github.com/LeaVerou/awesomplete/issues/16933#issuecomment-241245918","issue_url":"https://api.github.com/repos/LeaVerou/awesomplete/issues/16933","id":241245918,"user":{"login":"LeaVerou","id":175836,"avatar_url":"https://avatars.githubusercontent.com/u/175836?v=3","gravatar_id":"","url":"https://api.github.com/users/LeaVerou","html_url":"https://github.com/LeaVerou","followers_url":"https://api.github.com/users/LeaVerou/followers","following_url":"https://api.github.com/users/LeaVerou/following{/other_user}","gists_url":"https://api.github.com/users/LeaVerou/gists{/gist_id}","starred_url":"https://api.github.com/users/LeaVerou/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/LeaVerou/subscriptions","organizations_url":"https://api.github.com/users/LeaVerou/orgs","repos_url":"https://api.github.com/users/LeaVerou/repos","events_url":"https://api.github.com/users/LeaVerou/events{/privacy}","received_events_url":"https://api.github.com/users/LeaVerou/received_events","type":"User","site_admin":false},"created_at":"2016-08-21T08:45:06Z","updated_at":"2016-08-21T08:45:06Z","body":"Given that the highlighted matches do not correctly reflect the filter, I'd consider this a bug."}}
{"actor":{"display_login":"LeaVerou"}}