<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Jonathan Thompson</title>
    <description>The latest articles on DEV Community by Jonathan Thompson (@thompsonjonm).</description>
    <link>https://dev.to/thompsonjonm</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F180719%2F62b3ce29-cbe0-4f3a-abf3-fd92ed62e605.png</url>
      <title>DEV Community: Jonathan Thompson</title>
      <link>https://dev.to/thompsonjonm</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/thompsonjonm"/>
    <language>en</language>
    <item>
      <title>Expanding On the Tester Bill of Rights</title>
      <dc:creator>Jonathan Thompson</dc:creator>
      <pubDate>Thu, 25 Mar 2021 14:34:14 +0000</pubDate>
      <link>https://dev.to/thompsonjonm/expanding-on-the-tester-bill-of-rights-4mae</link>
      <guid>https://dev.to/thompsonjonm/expanding-on-the-tester-bill-of-rights-4mae</guid>
      <description>&lt;p&gt;I have been reading through &lt;em&gt;&lt;a href="https://www.amazon.com/Agile-Testing-Practical-Guide-Testers/dp/0321534468"&gt;Agile Testing: A Practical Guide For Testers And Agile Teams&lt;/a&gt;&lt;/em&gt;, by Lisa Crispin and Janet Gregory, when I found a small portion which discussed the existence of a "Bill of Rights" for programmers and customers. Lisa Crispin noted that a "Tester Bill of Rights" was absent, so she and Janet set forth to create one.¹&lt;/p&gt;

&lt;p&gt;The "Tester Bill of Rights" contains six articles, each describing a primary right or responsibility of the tester within an agile team. Unfortunately, there is a lack of detail regarding each article. New testers may find themselves asking questions of these articles, specifically:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;What does it mean to provide estimates for a sprint story?&lt;/li&gt;
&lt;li&gt;Why should I advocate for the "whole team" approach to quality?&lt;/li&gt;
&lt;li&gt;How can I approach my team about adopting new tools?&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;This article seeks to answer the above questions while providing insight into the articles that Janet Gregory and Lisa Crispin originally penned.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 1
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to bring up issues related to testing, quality, and process at any time."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;It is your priority as a tester to raise items pertaining to application quality at any time throughout the sprint process. These could be bugs, design inquiries, agile practices, or any other item which could be a target for continuous improvement.&lt;/p&gt;

&lt;p&gt;While a QA Automation Engineer at TransLoc, I noticed that my team's grooming process was more focused on fleshing out stories rather than refining the backlog. This caused the team to spend more time discussing stories, ultimately ending with "grooming" a single story per session when we should have been doing at least five. As a result, we were holding two grooming sessions a week which cut into development and testing time.&lt;/p&gt;

&lt;p&gt;I raised this as an issue to my team and discussed potential solutions with my scrum master. We decided that we would test grooming strictly as refinement time while asking for story writers to flesh out their tickets at least one week prior. The result was a net increase in efficiency as we were able to cut our time spent grooming and discussing tickets &lt;em&gt;in half&lt;/em&gt;. &lt;/p&gt;

&lt;p&gt;Speak up early and often about issues that you see, even if they do not directly pertain to quality and testing.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 2
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to ask questions of customers, programmers, and other team members and receive timely answers."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;I am personally guilty of succumbing to imposter syndrome and spinning over something that I would not reasonably know while testing a ticket. I have yet to kick this ugly habit despite being in this industry for half a decade. It has caused me to waste time  on development tickets that were otherwise straightforward. The solution?&lt;/p&gt;

&lt;p&gt;Ask questions, not just of your development team, but of product stakeholders and customers as well.&lt;/p&gt;

&lt;p&gt;One of my favorite elements of quality assurance is collaborating with my development team. I am a proponent of "desk checks" where, in an office setting, I will message a developer working on a feature and ask whether I can swing by to chat about how it is going. The developer walks me through what they have implemented so far, and I will take the time to ask any questions related to application quality. &lt;/p&gt;

&lt;p&gt;It should be agreed upon that there are no stupid questions during a desk check. Instead, you should feel free to ask any question, big or small, that can lead to greater understanding of the feature. &lt;/p&gt;

&lt;p&gt;I will also take time to speak with product owners and customers to better determine how our users consume the application. This not only helps when determining critical workflows or prime automation candidates, but also in becoming a stronger advocate for the customer.&lt;/p&gt;

&lt;p&gt;You should feel empowered to ask your team, or a customer, any question which will help you better understand the application and how it is used.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 3
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to ask for and receive help from anyone on the project teams, including programmers, managers, and customers."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;I ran into a situation recently where I was stretched thin and could not feasibly regression test all of my release tickets by myself. I had two choices:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Risk pushing the release back by testing everything alone&lt;/li&gt;
&lt;li&gt;Ask my team to help test with me&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I chose to ask my team to help me test, knowing full well that they are just as busy as I am. Our release went as scheduled and we were able to provide value to the customer.&lt;/p&gt;

&lt;p&gt;I understand that for many testers it can be difficult to approach a team of developers and ask for a hand with testing, or with understanding how a feature was implemented. I have experienced this first hand, most notably when starting for new teams or new companies. What drives me forward is the understanding that if I do not ask for help, I could be sandbagging my team.&lt;/p&gt;

&lt;p&gt;Do your best to help your team. Ask for assistance when needed, whether it be testing a ticket, clarifying a feature implementation, or understanding a process.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 4
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to estimate testing tasks and have these included in story estimates."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;I cannot begin to tell you how often I hear from testers that their efforts in automation or testing are not factored into story estimations. Simply put, this is an anti-pattern, and one that can cost your team sprint velocity should it spiral out of control.&lt;/p&gt;

&lt;p&gt;While it may be difficult to estimate the amount of time, t-shirt size, or effort points (whichever practice that your team follows) for testing items, you should do your best to provide a ballpark figure for the team to work with. The biggest concern that testers have when estimating is how to quantify the time they spend automating and testing.&lt;/p&gt;

&lt;p&gt;For example, you have a ticket that is estimated at 5 story points for development which should be about 2–3 days of work. Testing for the ticket, based on history with the product, will take about half a day. Automation is being built in parallel with development and will likely take about a day to complete when all is said and done. &lt;/p&gt;

&lt;p&gt;In my experience, I would estimate this story as an 8. I would personally add 0.5 points for testing and between 1–1.5 points for automation, resulting in 7 which rounds to 8 as the next Fibonacci number in the sequence.&lt;/p&gt;

&lt;p&gt;Estimate your testing activities. Not only will it provide your development team with a better idea of how much effort and time it takes to test, it will also bring more accuracy to your velocity measurement.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 5
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to tools you need to perform testing tasks in a timely manner."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;As a tester, you should feel empowered to ask for tools that may help you do your job, whether it is an open-source tool or a subscription. The best way to navigate this is by showing your leadership team the data as to why the tool is necessary for your day-to-day work.&lt;/p&gt;

&lt;p&gt;When I started out at Vodori, Inc. the development teams were utilizing the free version of Hiptest (now Cucumber Studio) which, at that time, only allowed a total of 10 users at a time. Our team was constantly adding and removing users as developers took part in writing and executing test scenarios. It was a fairly cumbersome and time consuming process.&lt;/p&gt;

&lt;p&gt;After about six months of wrestling with the free version, I raised that Vodori should consider the enterprise version. In an effort to state my case, I reached out to Hiptest and asked for a trial to be put in place. They gave us the enterprise version for one month with the stipulation that after the month was over, we would either need to pay or downgrade to the free version. &lt;/p&gt;

&lt;p&gt;I charted out the amount of time we spent removing and adding licenses against the cost for the enterprise version. I also noted the benefits of using enterprise, such as access to "Living Documentation".² I then presented this data to my QA Manager and the CTO of the company, arguing that we would be saving time and effort by using enterprise. &lt;/p&gt;

&lt;p&gt;&lt;em&gt;My case was denied&lt;/em&gt;. Simply put, Vodori was not in the position to rely on enterprise software at the time. We just did not have the funding to justify the expenditure.&lt;/p&gt;

&lt;p&gt;You should not feel apprehensive to ask for tools that can help you do your job better. State your case, show leadership the data, and be graceful should they deny your request.&lt;/p&gt;




&lt;h2&gt;
  
  
  Article 6
&lt;/h2&gt;

&lt;h4&gt;
  
  
  &lt;em&gt;"You have the right to expect your entire team, not just yourself, to be responsible for quality and testing."&lt;/em&gt;
&lt;/h4&gt;

&lt;p&gt;This is quite possibly the most important of the articles found in the "Tester Bill of Rights". Your team should understand that quality is an effort that the entire team should be working on, not just those responsible for the testing of the product. &lt;/p&gt;

&lt;p&gt;My team at Pendo.io has been diligently working toward bringing quality from the right swim lane into the left-hand columns. Rather than focus on quality at the end of the sprint like a waterfall team, we try to discuss quality concerns as early as possible. We have currently taken the following steps to ensuring that quality is a "whole team" effort:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Regular discussions on application quality and design in Slack&lt;/li&gt;
&lt;li&gt;Inviting testers to blueprinting, grooming, and planning meetings&lt;/li&gt;
&lt;li&gt;Noting quality impact during epic blueprinting, grooming, and planning &lt;/li&gt;
&lt;li&gt;Developers taking part in manual and automated testing&lt;/li&gt;
&lt;li&gt;Team forums on how to test and what to look for when testing&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;As Lisa Crispin and Janet Gregory emphasized many times in &lt;em&gt;Agile Testing&lt;/em&gt;, quality is a "whole team" initiative and not the sole responsibility of the testing party.³&lt;/p&gt;




&lt;h2&gt;
  
  
  Summary
&lt;/h2&gt;

&lt;p&gt;You cannot know everything, especially about new feature implementation. In these instances, ask your peers questions to strengthen your knowledge. Remember that you are not on an island, feel free to ask your peers for help whenever you feel the need to. Estimate quality tasks into sprint stories so they may provide a more accurate picture of your team's velocity. This will help fine-tune your sprints.&lt;/p&gt;

&lt;p&gt;Ask for the right tools, but be prepared to show leadership the data on why you need it and what it can do for you. Inquire about application quality, process, and testing in order to continuously improve. Most importantly, remember that quality is a team effort.&lt;/p&gt;




&lt;h2&gt;
  
  
  Resources
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;em&gt;Agile Testing: a Practical Guide for Testers and Agile Teams&lt;/em&gt;, by Lisa Crispin and Janet Gregory, Addison-Wesley, 2014, p. 50.&lt;/li&gt;
&lt;li&gt;"Living Documentation." Living Documentation | CucumberStudio Documentation, &lt;a href="//support.smartbear.com/cucumberstudio/docs/bdd/living-doc.html"&gt;support.smartbear.com/cucumberstudio/docs/bdd/living-doc.html&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt;
&lt;em&gt;Agile Testing: a Practical Guide for Testers and Agile Teams&lt;/em&gt;, p. 15.&lt;/li&gt;
&lt;/ol&gt;




&lt;p&gt;Jonathan Thompson is a Senior Quality Engineer at Pendo.io specializing in test automation. He currently resides in Raleigh, NC with his wife and a Goldendoodle named Winston. You can connect with him on &lt;a href="https://www.linkedin.com/in/jonathanmnthompson/"&gt;LinkedIn&lt;/a&gt;, or follow him on either &lt;a href="https://twitter.com/jacks_elsewhere"&gt;Twitter&lt;/a&gt; or &lt;a href="https://github.com/ThompsonJonM"&gt;Github&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>programming</category>
      <category>agile</category>
      <category>testing</category>
      <category>productivity</category>
    </item>
    <item>
      <title>Sharpen Your Testing Skills by Debugging in Cypress</title>
      <dc:creator>Jonathan Thompson</dc:creator>
      <pubDate>Wed, 24 Mar 2021 18:46:40 +0000</pubDate>
      <link>https://dev.to/thompsonjonm/sharpen-your-testing-skills-by-debugging-in-cypress-37k</link>
      <guid>https://dev.to/thompsonjonm/sharpen-your-testing-skills-by-debugging-in-cypress-37k</guid>
      <description>&lt;p&gt;Debugging - we have all been there. Staring at lines of code for hours on end wondering why something broke the way it did. Debugging automation code can be a frustrating and mentally exhausting experience. No matter the toolset, rooting through lines of code to determine where automation broke down is challenging.&lt;/p&gt;

&lt;p&gt;I personally am guilty of spotting an error, then immediately running my code again. For some reason I continue to think that the second time around my code will pass without issue. As if a 50% failure rate is anything to feel confident about - it is not.&lt;br&gt;
Thankfully, Cypress comes with methods and features which greatly increase an engineer's ability to successfully debug automation code in a quick and efficient manner.&lt;/p&gt;

&lt;p&gt;This tutorial assumes familiarity with Cypress and with test automation. We will use the &lt;a href="https://www.demoqa.com/elements"&gt;DemoQA Elements&lt;/a&gt; page as a basis for our testing and debugging activities.&lt;/p&gt;


&lt;h2&gt;
  
  
  Setting Up the Debugger
&lt;/h2&gt;

&lt;p&gt;In order to properly debug using Cypress, you must configure the browser window to open with developer tools. This can be done by adding the following code to your &lt;code&gt;index.js&lt;/code&gt; module within the plugins directory.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;&lt;em&gt;NOTE: Launching a browser instance without the above inside of your plugins &lt;code&gt;index.js&lt;/code&gt; module (or without the console manually opened) will not allow for debugging to take place.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;You can verify the code has worked by opening the Cypress GUI and running a test in headful mode. The browser window should now open with developer tools prominently displayed.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--XTgEWva7--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y287qh2ozgdwi93eg6kr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--XTgEWva7--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/y287qh2ozgdwi93eg6kr.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;




&lt;h2&gt;
  
  
  Debugging Methods
&lt;/h2&gt;

&lt;p&gt;Cypress allows for two separate debug methods:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;JavaScript &lt;code&gt;debugger&lt;/code&gt; statement&lt;/li&gt;
&lt;li&gt;Cypress’ &lt;code&gt;cy.debug()&lt;/code&gt; method&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;I have personally found the Cypress &lt;code&gt;cy.debug()&lt;/code&gt; method to be much more useful to a testing engineer so I will be focusing on its usage over the debugger statement. This is largely due to the fact that Cypress captures element criteria when the debug method is called.&lt;/p&gt;

&lt;p&gt;For example, you are building a test for selecting the dynamic click button on the &lt;a href="https://www.demoqa.com/buttons"&gt;DemoQA Buttons&lt;/a&gt; page. The dynamic click button is the third button shown on the page, below the double click and right click buttons. Writing out a simple call to get a button and click it fails as there is more than one button element on the page.&lt;/p&gt;

&lt;p&gt;A quick and easy way to find which button to select would be to use the debug method immediately after getting all buttons on the page.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;Running the above code will return the following in your browser window:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--lhv8RxU7--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/id56kag5hwzm4dcy2jnc.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--lhv8RxU7--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/id56kag5hwzm4dcy2jnc.png" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;As you can see, there are four buttons on the page with the dynamic click button occupying the third index. Opening the index within the console shows information for the selector, ranging from childNodes and innerText, to onClick data. For this particular issue, we will focus on the innerText entry as the button has a unique text node that we can work with.&lt;/p&gt;

&lt;p&gt;Using the &lt;code&gt;cy.contains()&lt;/code&gt; method with the text “Click Me” is not going to work in this instance, as there are three buttons with “Click Me” on the screen. Instead, we will resort to using a regex pattern and match it to the exact contents of the innerText data found when using the debug method.&lt;/p&gt;


&lt;div class="ltag_gist-liquid-tag"&gt;
  
&lt;/div&gt;


&lt;p&gt;Our test will now pass without issue as we are selecting the correct button on the screen.&lt;/p&gt;

&lt;p&gt;This may seem like a rudimentary example. The intention is to demonstrate the practice of using the &lt;code&gt;cy.debug()&lt;/code&gt; method for finding element criteria which can help build a selector for test consumption.&lt;/p&gt;




&lt;h2&gt;
  
  
  Past and Present
&lt;/h2&gt;

&lt;p&gt;One of the original features that drew me to adopt Cypress version 1.0.0 was the before and after DOM screenshots for page actions. Prior to Cypress, engineers would relied on two patterns for debugging via image screenshot:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;Manually enter screenshot calls within the test code&lt;/li&gt;
&lt;li&gt;Screenshot on after failure calls&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The trouble with the first was that it required the engineer to know specifically where to enter the screenshot call. In extreme cases, engineers would add screenshot calls before and after every action. Each automation run would then fill a directory with screenshots to sift through without context, further muddying the engineer’s ability to accurately troubleshoot automation issues.&lt;/p&gt;

&lt;p&gt;Screenshot on failure was only useful to determine application state when the action failed. It was not at all helpful with viewing application state prior to the failure.&lt;/p&gt;

&lt;p&gt;Cypress solves these issues by providing DOM screenshots before and after an action is taken on the page. Below is an interaction on the &lt;a href="https://www.demoqa.com/buttons"&gt;DemoQA Buttons&lt;/a&gt; page. When a user double clicks on a specific button, a message is shown in a container below the button rows.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Q5VU-D_Y--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d3micp2f2sqqyl5ajq4b.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Q5VU-D_Y--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/d3micp2f2sqqyl5ajq4b.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;The gif shows the Cypress test runner with “before” and “after” buttons at the bottom of the screen. The “before” button shows application state prior to action while the “after” button shows the result. Toggling the “after” button displays a screenshot with message text stating that a double click has occurred on the correct button, thereby confirming that a double click has taken place on the page.&lt;/p&gt;

&lt;p&gt;While this information is only available when running in headful mode, it allows an engineer to review actions that have been taken within the application and the application’s state immediately prior. This can prove to be extremely helpful during debugging by providing a base for when to add &lt;code&gt;cy.debug()&lt;/code&gt; methods.&lt;/p&gt;




&lt;h2&gt;
  
  
  Capture It On Video
&lt;/h2&gt;

&lt;p&gt;By default in headless mode, Cypress captures video files for each test which has completed — whether it passes or fails. These videos can provide a glimpse into application state during the test while showing the overall workflow under test. Engineers can use these videos to quickly spot errors within application state, taking into consideration what actions are occurring so as to mark where debug statements need to be entered.&lt;/p&gt;

&lt;p&gt;As a test engineer, you should be reviewing the videos after every failure in order to determine where to begin troubleshooting. While they are not interactive, they do provide adequate context.&lt;/p&gt;




&lt;h2&gt;
  
  
  Pause for Effect
&lt;/h2&gt;

&lt;p&gt;Many programming languages feature a Read-Evaluate-Print Loop (REPL) which allows an engineer to step into the code during execution. From here, the engineer can write out steps and watch the result of their commands in real time. I am intimately familiar with this pattern as a good portion of my automation experience is with Python and Ruby, both programming languages that feature REPLs.&lt;/p&gt;

&lt;p&gt;Each language allowed me to write automation code, open a headful window, then step into it using &lt;code&gt;binding.pry&lt;/code&gt; for Ruby and &lt;code&gt;breakpoint&lt;/code&gt; for Python, respectively. Once inside, I could write out the code for the next step of the test within the REPL and watch the results of my interactions. This process allowed me to see the actions execute and what sort of issues I should be looking for, such as slow-loading elements that need to be waited upon.&lt;/p&gt;

&lt;p&gt;Unfortunately, JavaScript does not feature a REPL. However, the creators of Cypress did provide us with an alternative: the &lt;code&gt;cy.pause()&lt;/code&gt; method.&lt;/p&gt;

&lt;p&gt;Using the pause method stops your automation code and provides two additional features:&lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;A play button&lt;/li&gt;
&lt;li&gt;A next button&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;The play button will simply run the test as normal. It is the next button that is critical to troubleshooting automation code.&lt;br&gt;
Here is the button in action:&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--OlGnng3K--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3lznuz3nxyuj4p6ca2bz.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--OlGnng3K--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3lznuz3nxyuj4p6ca2bz.gif" alt="Alt Text"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Using the next button, we can view the action and result for each step of code in our test. This is extremely powerful as it allows the engineer the ability to view results outside of the confines of video or screenshots. Instead of static assets, the engineer is directly controlling Cypress. This is perfect for troubleshooting page loads, finicky selectors, or all manner of other issues.&lt;/p&gt;

&lt;p&gt;I personally use this pattern whenever I find myself troubleshooting with Cypress, no matter the size of the issue. The &lt;code&gt;cy.pause()&lt;/code&gt; method is far too powerful to not use when writing or maintaining automation code.&lt;/p&gt;




&lt;h2&gt;
  
  
  Summary
&lt;/h2&gt;

&lt;p&gt;Debugging test automation does not have to be a painful experience. By using Cypress’ debug method, you can spy application elements for use within test automation code. Reviewing DOM screenshots and videos allows you to build context for entering debug statements. Finally, the &lt;code&gt;cy.pause()&lt;/code&gt; method is a powerful tool which allows an engineer to step into the test code as it runs and manually execute test steps.&lt;/p&gt;

&lt;p&gt;Each of these tools will greatly enhance your ability to troubleshoot and debug automation code.&lt;/p&gt;




&lt;h2&gt;
  
  
  Resources
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;“Debugging.” Cypress Documentation, 5 Mar. 2021, &lt;a href="//docs.cypress.io/guides/guides/debugging.html"&gt;docs.cypress.io/guides/guides/debugging.html&lt;/a&gt;.&lt;/li&gt;
&lt;li&gt;Cypress-Io. “Proposal: Add Command-Line Flag for Opening Dev Tools during Run · Issue #2024 · Cypress-Io/Cypress.” GitHub, &lt;a href="//github.com/cypress-io/cypress/issues/2024"&gt;github.com/cypress-io/cypress/issues/2024&lt;/a&gt;.&lt;/li&gt;
&lt;/ol&gt;




&lt;p&gt;&lt;em&gt;This article was originally published on &lt;a href="https://javascript.plainenglish.io/sharpen-your-testing-skills-by-debugging-in-cypress-597de915ffab?sk=6635b933dd188827eb498e2b36ff2cbe"&gt;Medium&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Jonathan Thompson is a Senior Quality Engineer at Pendo.io specializing in test automation. He currently resides in Raleigh, NC with his wife and a Goldendoodle named Winston. You can connect with him on &lt;a href="https://www.linkedin.com/in/jonathanmnthompson/"&gt;LinkedIn&lt;/a&gt;, or follow him on either &lt;a href="https://twitter.com/jacks_elsewhere"&gt;Twitter&lt;/a&gt; or &lt;a href="https://github.com/ThompsonJonM"&gt;Github&lt;/a&gt;.&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>testing</category>
      <category>tutorial</category>
      <category>programming</category>
    </item>
  </channel>
</rss>
