Writing mochitests for new features in DevTools can be difficult and time-consuming. There are so many elements interacting in an async manner that I oftentimes find myself using the debugger to debug the debugger! In the case where it’s unclear what interaction isn’t working properly, I find myself going to a neat utility function: waitForever
. By using this function, paired with await
, I can interact with the page while a given test is running to find the problem!
The JavaScript
waitForever
is a super small snippet:
function waitForever() { return new Promise(r => {}); } // Usage: await waitForever();
The function uses a promise which never resolves, thus no additional statements are triggered while also not locking up the browser. From there I can click around and explore elements to find what I’ve messed up in my test.
Utility functions like these make web development much easier and more enjoyable. Add this one to your toolbox!
-
How I Stopped WordPress Comment Spam
I love almost every part of being a tech blogger: learning, preaching, bantering, researching. The one part about blogging that I absolutely loathe: dealing with SPAM comments. For the past two years, my blog has registered 8,000+ SPAM comments per day. PER DAY. Bloating my database…
5 Awesome New Mozilla Technologies You’ve Never Heard Of
My trip to Mozilla Summit 2013 was incredible. I’ve spent so much time focusing on my project that I had lost sight of all of the great work Mozillians were putting out. MozSummit provided the perfect reminder of how brilliant my colleagues are and how much…
Duplicate the jQuery Homepage Tooltips Using MooTools
The jQuery homepage has a pretty suave tooltip-like effect as seen below: Here’s how to accomplish this same effect using MooTools. The XHTML The above XHTML was taken directly from the jQuery homepage — no changes. The CSS The above CSS has been slightly modified to match the CSS rules already…
Create Spinning, Fading Icons with CSS3 and MooTools
A goal of my latest blog redesign was to practice what I preached a bit more; add a bit more subtle flair. One of the ways I accomplished that was by using CSS3 animations to change the display of my profile icons (RSS, GitHub, etc.) I…
Credit: Source link