eCommerce QA: Beyond Load and Performance Testing
Tags: blackfriday, cybermonday, softwaretesting, ecommerce
Published: 2019-11-18 09:08:43

<section class="post-full-content">
                <div class="post-content">
                    <figure class="kg-card kg-image-card kg-card-hascaption"><img src="https://www.browserstack.com/blog/content/images/2019/11/Banner-1.png" class="kg-image"><figcaption>eCommerce Quality Assurance: Beyond Just Load &amp; Performance Testing</figcaption></figure><p>Holiday shopping this year is projected to cross a <em>trillion </em>dollars. US retail eCommerce spending will rise 13.2% to $135.35 billion. There’s a lot riding on <em>seamless, cohesive</em> <em>eCommerce experiences </em>this season—considering what happened during last year’s Black Friday frenzy. </p><p>Walmart, Lowe’s, Lululemon, Ulta, and J.Crew—the biggest e-tailers on the planet—went down due to high demand. The 150-minute outage cost Walmart alone about $9 million in lost sales and affected more than 6 million potential shoppers. Lowe’s’ irritated customers took to social media to complain. </p><p>To avoid all this, e-tailers double-down on the infrastructure that keeps their portals up and running. That prepares your website for exceptional volumes of traffic. <em>But is it enough to deliver great experiences to online customers across 4 continents?</em></p><h2 id="the-impact-of-front-end-bugs-on-online-quality-of-experience">The impact of front-end bugs on online quality of experience</h2><p>If your site experiences downtime, you receive alerts and everyone rushes to fix the issue till the website’s back up. <strong>Front-end bugs aren’t as ‘visible’. </strong>They don’t make the news. But their impact on the bottom line is just as harmful.</p><figure class="kg-card kg-image-card kg-card-hascaption"><img src="https://www.browserstack.com/blog/content/images/2019/11/Reference.png" class="kg-image"><figcaption>Bad QA examples - Front-end bugs that hit the eCommerce companies in the pastSome examples of front-end bugs that hit eCommerce companies</figcaption></figure><h4 id="-no-one-wants-to-purchase-from-a-website-that-looks-like-it-s-held-together-by-spit-and-prayers-">“No one wants to purchase from a website that looks like it's held together by spit and prayers.”<br></h4><p>Black Friday is a big deal in the US, UK, and Australia, and brands have to adapt the online experience to fit the cultural context. The idea, wholesome (and profitable) as it is, involves long hours spent designing and developing UI/UX for:</p><ul><li>users’ device settings (language and time),</li><li>real-time location data (via IP Geolocation or GPS),</li><li>network connections,</li><li>access restrictions,</li><li>and more. </li></ul><p>That’s a complex collection of media assets, code, business logic, APIs, 3rd-party tools and libraries in one website or app. <em>And it can break </em>when accessed through combinations of: </p><ul><li><strong>Devices</strong>: Responsive eCommerce themes, even <em>premium ones, </em>are known to have <a href="https://community.shopify.com/c/Shopify-Discussion/Mobile-Logo-and-Menu-not-showing/td-p/561403"><em>broken navigation on mobile</em></a><em>. </em></li><li><strong>Browsers</strong>: The cart-to-checkout journey, which is an eCommerce website’s bread-and-butter, can break on a <a href="https://help.decathlon.com.au/support/solutions/articles/8000059244-can-t-place-an-order-cannot-create-an-account-or-cannot-checkout-">major browser like Safari</a>. </li><li><strong>Screen resolutions: </strong>In a usability <a href="https://baymard.com/ux-benchmark">analysis of top 60 eCommerce websites</a>, more than half turned out to have broken product page layouts, descriptions and images on mobile. </li></ul><blockquote>“The number and combinations of screen sizes, browser features, input modes, and device capabilities have grown to staggering figures. Unfortunately, the testing practices and technological underpinnings of eCommerce sites haven’t been (and still aren’t) equipped to handle the onslaught of different contexts that must be supported, making layout bugs commonplace.”</blockquote><blockquote>—Baymard Institute (Independent UX Research Organization)</blockquote><p>In the weeks leading up to Black Friday and Cyber Monday, engineering teams are so focused on load and performance testing that functional, UI and compatibility checks take a back seat. By the time the updates are ready for release, there’s no room for comprehensive checks and debugging<em>.</em> Eventually, you end up releasing buggy sites/apps to production. <br><br>So how do you deliver great online shopping experiences—on time—without cutting back on quality assurance?</p><h2 id="qa-for-ecommerce-in-the-run-up-to-holiday-shopping-season">QA for eCommerce in the run up to holiday shopping season</h2><p>We asked our customers within the eCommerce niche to see how they deliver quality, without compromising on time-to-release. Our focus was on ways to improve visibility into release quality early in the cycle, and practical solutions that can be implemented in the short window of time (before the holiday shopping season kicks off in earnest).</p><figure class="kg-card kg-image-card kg-card-hascaption"><img src="https://www.browserstack.com/blog/content/images/2019/11/Holiday-Season.png" class="kg-image"><figcaption>How to make your eCommerce website ready for the holiday season</figcaption></figure><p>So with two weeks left to go, you should: </p><ol><li><strong>Let QA focus </strong><em><strong>exclusively </strong></em><strong>on testing</strong>: They have new automated tests to write, old tests to update, and changes to inform throughout the faster-than-usual release cycles. Anything else (like maintaining test infrastructure) is a drain on the QA team’s time.<br>If you are a QA engineer reading this and don’t have an in-house grid to maintain, learn how to make the most of your cloud testing solution. Check out our <a href="/blog/12-ways-to-better-functional-testing-on-the-cloud/">12-step guide to better, faster functional testing on cloud</a>.</li><li><strong>Create more ‘checkpoints’ across the release pipeline. </strong><em>Bugs are easier (and cheaper) to fix when caught early. </em>You don’t have to spend hours on a brand new discounts module—only to find 2 hours before release that it’s breaking the checkout page on Chrome 76-on-Android.</li></ol><p>To prevent these surprises, <em>distribute the testing throughout the release cycle. </em></p><p><a href="https://sg.carousell.com/">Carousell</a>, Asia’s largest eCommerce marketplace, built test suites as checkpoints for different stages of the release cycle, with a specific target (test execution time) for each. Their pipeline involves: &nbsp;</p><p>Regression, which comprised all <em><strong>automated end-to-end tests</strong></em>, that runs outside work hours. Execution time is not critical here, so add your exhaustive and edge cases here. <br><em>If you’re a QA reading this, check out some quick tips</em><a href="/blog/3-part-guide-faster-regression-testing/"><em> on creating faster regression test scripts and suites</em></a><em>.</em></p><p>Sanity, which verify the stability of each release candidate or hotfix, &nbsp;<em><strong>finish within the hour or less</strong> </em>(depending on your pace). The faster you get visibility, the more time you’ll have to debug and verify. </p><p>Fast Feedback Tests: Carousell coined this term for a suite of <em><strong>basic tests that verified the core functionality </strong></em>of their apps. They run this to verify the stability of changes<em> before merging them</em>. <a href="/blog/automated-end-to-end-tests-and-how-they-fit-into-our-testing-culture/">Martin Schneider, Delivery Manager, Carousell, writes</a>, “The goal is to receive a test result no longer than 30 minutes after an engineer pushes a pull request to the Android or iOS code base. &nbsp;Given that it takes ~15 minutes to build the iOS app from source (Android is faster), there’s not much time left for testing.”<br>Apart from Fast Feedback Tests, Carousell does all their testing on real Android and iOS devices. </p><p><strong>3. Test against as many device/browser combinations as possible.</strong> Why detract from <em>your potential market </em>when you can support basic purchase workflows on most of them without too much additional effort? &nbsp;<br>You can realistically aim for 70% global coverage by testing against:</p><ul><li>3 device types—mobile, desktop, and tablet</li><li>2 iOS versions</li><li>5 Android versions</li><li>6 browser families (and specific versions within each browser family)</li><li>10 screen resolutions</li></ul><p>To find out the precise combinations of devices and OS/browser to test against this holiday season, check out the <a href="https://browserstack.com/blog/understanding-browser-os-and-device-fragmentation/">Q3 2019 statistics of fragmentation across the globe</a>. Follow it up with an explainer on <a href="https://browserstack.com/blog/perfect-test-strategy-for-mobile/"><em>how </em>to create your own cross-device test strategy</a> by Hylke de Jong, automation test engineer at Netherland’s largest eCommerce portal, Wehkamp.nl.</p><p><strong>Note:</strong> Keep in mind that front-end UI tests can be slower than headless tests. To get test results within your targeted test execution time, <em>parallelize<strong>. </strong></em></p><h2 id="tl-dr">Tl;dr</h2><p>In 2018, well over 50% of 1,100 US-based shoppers planned to shop online during the holidays.</p><figure class="kg-card kg-image-card kg-card-hascaption"><img src="https://www.browserstack.com/blog/content/images/2019/11/Table.png" class="kg-image"><figcaption>Channels used by US holiday shoppers to buy this holiday season.&nbsp;</figcaption></figure><p></p><p>In 2019, eCommerce revenue during the holiday season will <a href="https://blackfriday.com/news/black-friday-predictions">surpass $12 billion</a> and most of them shopping either on the mobile or desktop. </p><p><br>There’s just about enough time to test your websites and apps before the big-holiday-sale floodgates open. Remember to:</p><ul><li>Let your QA work on test automation, instead of grid/device-farm maintenance.</li><li>Distribute testing <em>throughout </em>the release cycle to avoid surprises just before release.</li><li><em><em><em>Test against device/browser/OS combinations, </em>throughout the release cycle, to prevent unexpected UI issues on production.</em></em></li></ul><p>Go and make those sales.</p><p><em>Happy holidays!</em></p><p>Resources:</p><ol><li><a href="https://www.emarketer.com/chart/222961/which-devices-do-us-holiday-shoppers-plan-use-holiday-shopping-of-respondents-by-shopping-day-sep-2018">https://www.emarketer.com/chart/222961/which-devices-do-us-holiday-shoppers-plan-use-holiday-shopping-of-respondents-by-shopping-day-sep-2018</a></li><li>https://www.businessinsider.in/retail/stores-like-walmart-lowes-and-j-crew-have-a-new-nightmare-for-black-friday-and-it-signals-a-fundamental-shift-in-how-we-shop/articleshow/66779159.cms</li><li><a href="https://www.softwaretestingmagazine.com/knowledge/top-5-challenges-of-automation-in-retail-testing/">https://www.softwaretestingmagazine.com/knowledge/top-5-challenges-of-automation-in-retail-testing/</a></li><li><a href="https://baymard.com/blog/ecommerce-layout-bugs">https://baymard.com/blog/ecommerce-layout-bugs</a></li><li><a href="https://baymard.com/blog/handling-technical-glitches-without-losing-sales">https://baymard.com/blog/handling-technical-glitches-without-losing-sales</a><br></li></ol>
                </div>
            </section>
This post was originally posted here: http://bit.ly/ecommerce-qa