{"id":3097,"date":"2013-12-22T23:49:51","date_gmt":"2013-12-23T05:49:51","guid":{"rendered":"http:\/\/bililite.com\/blog\/?p=3097"},"modified":"2013-12-22T23:49:51","modified_gmt":"2013-12-23T05:49:51","slug":"bitten-by-the-asynchronous-bug","status":"publish","type":"post","link":"https:\/\/bililite.com\/blog\/2013\/12\/22\/bitten-by-the-asynchronous-bug\/","title":{"rendered":"Bitten by the asynchronous bug"},"content":{"rendered":"<p>As luck would have it, right after I wrote about <a href=\"http:\/\/bililite.com\/blog\/2013\/12\/16\/thinking-about-synchonicity\/\" title=\"Thinking about synchonicity\">synchronous vs. asynchronous event handlers<\/a>, I found exactly that problem in by <a href=\"http:\/\/bililite.com\/blog\/2011\/01\/17\/cross-browser-text-ranges-and-selections\/\" title=\"Cross-Browser Text Ranges and Selections\"><code>bililiteRange<\/code><\/a> code. It uses <code class=\"language-javascript\" >dispatchEvent<\/code> to fire an <code class=\"language-javascript\" >input<\/code> event when text is inserted, but <em>that<\/em> fires synchronously, so that the event handlers run before the <code class=\"language-javascript\" >bililiteRange.text()<\/code> has fully run. I ended up having to wrap the <code class=\"language-javascript\" >dispatchEvent<\/code> in a <code class=\"language-javascript\" >setTimeout<\/code> to force it to be asynchronous.<\/p>\n<p>The <a href=\"https:\/\/github.com\/dwachss\/bililiteRange\/blob\/master\/bililiteRange.js\"><code class=\"language-javascript\" >bililiteRange.js<\/code> code<\/a> is now at version 1.7.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>As luck would have it, right after I wrote about synchronous vs. asynchronous event handlers, I found exactly that problem in by bililiteRange code. It uses dispatchEvent to fire an input event when text is inserted, but that fires synchronously, so that the event handlers run before the bililiteRange.text() has fully run. I ended up [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10],"tags":[],"_links":{"self":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3097"}],"collection":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/comments?post=3097"}],"version-history":[{"count":1,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3097\/revisions"}],"predecessor-version":[{"id":3098,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/posts\/3097\/revisions\/3098"}],"wp:attachment":[{"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/media?parent=3097"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/categories?post=3097"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bililite.com\/blog\/wp-json\/wp\/v2\/tags?post=3097"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}