Testflow

testflow

Before you can start developing your cloud-based app, you need to create an MVP (minimum viable product). This is the simplest version of your cloud-based app and will require the least development time. It should also provide some basic features for your users. This way, you can focus on developing more features later. Challenges There are a number of challenges that accompany cloud app development. A primary one is finding the right talent. It isn't practical to conduct traditional recruitment in 2021; therefore, the best solution is to employ staff augmentation, a that outsources business processes temporarily. $490 billion industry The size of the development team is also a factor that affects the cost. The size depends on how complex your app is. Another factor is the location of your team. Some companies can provide an entire team to complete your project while others may only provide a single developer. Different companies charge differently for the work they do. For instance, a freelancer can develop an MVP for around $10,000. Scalability is another issue when using cloud-based apps. While most cloud providers advertise scalability, this doesn't necessarily mean that they can deliver it. In order to get the most out of your cloud resources, you must monitor their performance, SLAs, and business dependencies. If your app is down, it can cost you money and drive away customers. Another concern with cloud-based apps is the security of the application. A cloud app is more vulnerable to hacker attacks than a traditional app, so making sure that you use a reputable cloud service provider is imperative. Additionally, you must be aware of the regulations that govern the cloud environment. HIPAA and GDPR are two examples of regulations that apply to cloud-based apps. When considering cloud-based app development, remember that this technology is constantly evolving. According to Forbes, 5.4 million developers are working on cloud applications. This rapid growth in cloud technology has opened many opportunities for developers. However, there are some challenges as well. Choose the right cloud service provider and plan carefully for scalability. The most important consideration in creating a cloud-based app is the security of your data. Since cloud applications depend on third-party API integrations, it's important to understand how each API interacts with other systems. Furthermore, cloud applications are vulnerable to security breaches, especially when data is shared frequently. In order to avoid this, security must be a top priority for all developers. Benefits of Cloud App Development One of the benefits of cloud-based apps is that they allow users to work from anywhere with an internet connection. It eliminates location constraints and connectivity issues, making it easier for employees to work on the go. A cloud-based app is the same as a traditional application, except that it is hosted on a remote server. This means that anyone with internet access can access it from any computer or mobile device. It is vital for businesses to plan ahead and develop their applications in a cloud-based environment. A cloud-based app allows organizations to store data in a secure location. This allows them to collect user feedback and keep track of deficiencies. It also removes the need for server infrastructure. The cloud provider handles all server-related issues. This allows companies to focus on other important aspects of their business. Another advantage of using a cloud-based app is the flexibility it gives businesses. With , employees can access corporate data on the go, from any location. This enables companies to encourage remote-working staff. Also, cloud-based apps ensure that data is consistent, as changes made to files are synced automatically in real-time. mobile devices becoming more common Another benefit of using cloud-based software is the ease of scalability. If a company wants to add new features, it can scale them quickly without having to wait for months for on-premise resources to become fully functional. For instance, Pinterest, the visual bookmarking website, uses the AWS cloud service to handle data analysis and processing. In this way, the company can deliver a seamless customer experience. Additionally, cloud-based applications are more environmentally friendly. is the increased security. With fewer updates and maintenance, cloud-based software is more reliable than its desktop counterpart. Additionally, cloud-based apps are generally more affordable than their desktop counterparts. It also allows users to work from home and reduce the cost of office space. One of the biggest advantages of cloud-based apps is another big advantage. It prevents duplicative documents, enabling staff to work on projects without having to wait for documents to be shared between teams. Users can also easily trace and edit data, as well as roll back to earlier versions if errors occur. Because cloud-based applications are hosted in the cloud, collaboration is extremely simple and fast. Cloud-based collaboration Technology A successful cloud-based app development process requires a highly specialized team of developers. In order to be effective, the team needs to have the right mix of technical and creative skills. It must be prepared to embrace changes and be fully invested in the project. For example, developers should be able to change their code quickly and easily without risking losing their work. In addition to being highly specialized, the team should have the right set of tools to manage its workload. Cloud service providers should have several data centers to maximize the speed of content delivery. Using content delivery networks is a good idea as well. This allows you to easily scale your service and handle more users. In the long run, this will increase your profit margin. The right cloud service provider can handle more users, which is great for your business. Once your cloud-based app is built, you should test it on several platforms, such as Google Play and Apple App Store. to ensure that your app is functioning correctly, and Apple uses real testers to test each app for bugs. You should also make sure that your app follows all App Store and Google Play guidelines and that you have filled out all the required meta-data. Once your app is approved, the team of the App Store/Google Play will begin to test it. Google Play uses automated testing The next step is to determine the right architecture for your cloud solution. There are several important factors to consider, including your app's purpose and the market it will target. For example, Netflix uses a cloud-based application model to host its video content. A cloud-based app's architecture should be scalable enough to handle the demands of your target market. For this, you should consider whether or not to use a classic data architecture or a more modern microservices approach. After identifying the proper architecture, the next step in Cloud-based mobile app development is to consider the minimum hardware requirements of your device. For example, a cloud app may need more memory than a normal mobile app. And, unlike conventional database solutions, cloud apps also require more database resources. Therefore, you should choose a database that can handle the demands of your app in the future. UI/UX design UI/UX design is a fundamental aspect of cloud-based applications. As more companies migrate their desktop applications to the cloud, there is an increased need to rethink how the user experience should be designed. An app's user experience should be easy to use and have a smooth user flow. It should also be intuitively designed with actionable items that are easily accessible and transparent. This can be achieved by adding relevant icons to the design and keeping the content concise. An effective UI/UX design helps to increase consumer satisfaction. A happy customer will be more willing to upgrade the features of an application. This will build a business's credibility and worth. It will also result in higher conversion rates. The goal is to create a product that users enjoy using and will want to continue using. Cloud-based design platforms are an excellent choice if you are looking to save time and money. They allow designers to collaborate on projects in real-time, which means you don't need to hold formal meetings to approve designs. Additionally, cloud-based design platforms are usually cheaper than desktop software and provide access to the same tools as desktop software. A good UX can increase the customer base of a cloud application and make them more profitable for the company. It also improves the application's performance and reduces the need for training. A positive user experience will lead to a greater number of customers and higher customer satisfaction. When designing a mobile app, the UI/UX design process must be streamlined and enjoyable to use. The design process involves several different stages, and each stage must be carefully thought out. Different design teams may have different workflows, but the design process must be consistent and meet the needs of each user scenario.

Developing a Cloud-Based App in 2023

As we look forward to 2021, Synthetic Monitoring continues to be as important as ever in understanding the performance of your app or website. But your synthetic monitoring is only as good as the tool you're using and there are a lot of product choices. Since selecting the best one for you is critical, the choice can be overwhelming. Price, setup ease, accuracy, and more play a part in the best solution. In this article, I reviewed six popular synthetic monitoring choices: Updown.io, UptimeRobot, StatusCake, Site24x7, Pingdom, and DataDog, and applied several measurements against them in a real-world situation to see how each product performed. Then, I set up a typical example deployment on DigitalOcean and ran tests for five days against each product. Finally, I collected the metrics and compared them against one another to determine which tool was the best. Let’s start with a little background. Synthetic Monitoring Synthetic monitoring is the practice of simulating what an end user might do on your website or app, and then monitoring that website or app for performance. It's a key tool for measuring end user availability. By the time a bug or regression hits your active site, it’s too late to prevent the impact. However, these tools can help you quickly resolve issues and contain the damage. One of the most common types of synthetic monitoring is using externally-hosted tools to periodically open a site or URL and determining if it loads properly and how long it takes to respond. "Properly" can be defined during the creation of the test, and what happens with that data can vary from product to product, but typically includes features such as screenshots of failures, waterfall latency to determine where page load slow-downs derive, or even fully synthetic workflows such as logging in as a user and executing a transaction. While it's possible to roll your own synthetic monitoring through localized testing, there’s no replacement for a solid product that uses monitoring to report exactly what your customers are seeing—and from an unbiased source. That's why DevOps teams tend to rely on these products to help correlate issues outside their scope of monitoring and validate when a user is seeing impact even when the systems think they're healthy. last-mile Considerations Now let's look at the considerations I used to compare the products. The relationship between your product and your monitoring tool will hopefully exist for a very long time. So it’s important to get it right the first time since a miscalculation in monitoring services could be the difference between customer success and customer distrust. So we’ll be comparing our services using six key requirements that any business and team should consider before committing to what will be a partner in your product’s success: Pricing Setup ease Accuracy Day 2 operability Notification channel integrations Application Performance Metrics (APM) Integrations Let's look at each of these in a little more detail. 1. Pricing As with many business decisions, our number one consideration is price. There's no reason to use a service that begins at a low cost but results in exorbitant costs over time as you grow. So we’ll be explicitly looking at cost per site on a per-month basis. 2. Setup Ease The next biggest consideration is how much work is involved in the monitoring, alerting, and management of the services. If it is too difficult, your team may not even use the service that you’re paying for in the first place. Unfortunately, there are many variables in determining “difficulty” as a Key Performance Indicator. Here we'll give a score of 1-5 (5 being the best) based on difficulty in finding the options to create, edit, and delete basic synthetic tests. 3. Accuracy If alerts are constantly firing they can breed a sense of distrust and complacency or “Alarm Fatigue” that commonly plague operations and developers alike. If a tree falls in a forest, and everyone hears it every 10 minutes for days at a time, is anyone really monitoring? The antithesis is also true. If no alarm fires, was your site ever really monitored at all? There are numerous considerations here, so I will assign a score of 1-5 (5 being the best) based on the following metrics: Time from detecting the failure to attempt to escalate is within 15 minutes Time from escalation of the failure alert to the time Pagerduty sends a text message is within 5 minutes The time from the failure injection to the time that a developer was notified is within 20 minutes The percentage of false alerts over a 24 hour period is below 1% The percentage of positive failures detected is above 99% 4. Day 2 Operability Implementation and reporting are just the first steps of any observability platform, but the things your human teammates will care about most is how easy it is to utilize and interpret the results. While this is a more subjective analysis, it’s no less important. This will pass or fail on being able to easily and intuitively navigate to an alert, and identify the source of the failures. 5. Notification Channel Integrations (Slack, Discord, Email, Pagerduty, and others) Users should be able to get notifications where they feel most comfortable, and different types of systems may require different types of alert severity. It may not be important to dial an engineer for Jira failures over a weekend, but it’s very important to get all hands on deck ASAP when the entire site is down. We’ll be scoring 1-10 (10 being the best) with special weight for Slack, Discord, email, and Pagerduty integrations. I went with 10 here instead of 5 to more accurately account for the range of integrations possible. 6. APM Integrations Finally we’ll be considering the difficulty to triage incidents. Namely, do each of these products offer options to tie back into your core monitoring systems for better correlation and root cause analysis? Our Test To fairly test each monitoring service, I've built a common paradigm for website edge components on DigitalOcean in three different datacenters (San Francisco, New York, and London). I used DigitalOcean load balancers and CloudFlare Geo Routed Edge Proxies. Each test will run against this setup to determine site availability, status code, and response time. The service itself is a simple Nginx container running on Debian 10 hosts. We will inject faults by partially shutting down services for 20 minutes on a single container, and then entirely for 30 minutes across all containers. Afterwards, we will determine how long it takes each service to catch the failure and alert. Agents will be set up with similar configurations. By shutting off services on various hosts, we can simulate a code deployment or application failure that should be enough to take services out of the load balancers configured in DigitalOcean and CloudFlare. Based on our design, we should be extremely resilient to such faults and agile in our rollouts. However, as seasoned admins, we know that there is still a limit to even this level of distribution and resiliency, and it is our fail-safe last-mile monitoring that alerts us to critical customer impact. Because each product has vastly different timings allowed for trial accounts, we'll level the playing field by setting each service to 15-minute threshold alerts and multiple failures before alerting where applicable. Each product should be able to tell us the moment it detects the site is no longer reachable during our deployments. In a perfect world, our partial deployments (though they may cause some latency or reduced capacity) shouldn't impact any customers, and so should not alert for downtime. The Comparison We're all set up and ready to go, so let's deploy the products and see how each one performs. I'll provide a summary table for each product, including the setup details, metrics/results, and then an overall impression. At the end, I'll summarize my thoughts on which product is best. 1. Updown.IO Price/mo - $.07 Setup ease - 5 Accuracy - 4 Operability - Fail Notification Channels - 6 APM Integration - No A relatively small French company, 's goal is to provide an inexpensive and user-friendly tool with a simple, slick interface. Updown The Setup Setup was extremely simple: adding a URL and a handful of settings immediately allowed me to monitor my site with a beautiful dashboard. The score for configuration notifications took a hit due to the out-of-sight, out-of-mind location of the options, and the limited number of options available. To configure Pagerduty, I had to set up a custom webhook or trust in the SMS notification options provided by the tool itself. Metrics and Results The other notifications that I configured came through with a concise summary of the problem, but the tool didn't provide any  immediate road back to the original alert like the other tools on this list. Furthermore, after browsing back to the site manually and diving deeper into the alert itself, I couldn't easily zoom or gather more data other than what was provided in the image above. Overall Impression This tool specializes solely in notifying issues. Beyond that, however, there was a heavy reliance on unaffiliated third-party tools. That being said, the cost of monitoring with this tool is extremely affordable, and the barrier to entry so low, that it may still be worth considering, if you are willing to put in the work of figuring out the appropriate way to set up two-way escalation methods like Pagerduty. 2. UptimeRobot Price/mo - $.2 Setup ease - 5 Accuracy - 5 Operability - Fail Notification Channels - 10 APM Integration - No With simple monitoring, simple setup, and a free-tier option to boot for entry-level monitors, is a low-barrier option for quickly implementing site monitoring. UptimeRobot The Setup Test configuration was extremely simple, however, that's all you can really do in the primary interface of this tool. It was difficult to find the escalation points as they were nested in the global configurations. But they did provide many pre-canned setup options making my notification setup a breeze. Metrics and Results The escalations all fired very quickly without any false positives. Thboth outages and only alerted on the latter complete outage. Unfortunately, diving into the ale product detected ert itself was somewhat vague as I couldn't see where the failures occurred. The summary only showed a rough graph of response times and the timestamps. There wasn't zoom functionality, which means that it was only useful as a trigger to start investigating rather than real clues on where to dig in. Overall Impression The setup is super easy and the price is fantastic. With accurate escalations this covers the very baseline of everything I’d want in a synthetic monitor. Unfortunately, due to the lack of functionality available to understand the nature of the failure, this tool is best used as a trigger to the real work rather than a finder of smoking guns. 3. StatusCake Price/mo - $.2 Setup ease - 4 Accuracy - 3 Operability - Pass Notification Channels - 10 APM Integration - No is an inclusive monitoring solution specializing in web health checks. With a free tier option as its cheapest option, it's a great solution for a place to start. StatusCake The Setup StatusCake has clear instructions on how to create new tests. However, it lost some points due to its very busy interface. But after the initial color shock, the workflow in the navigation pane was simple to understand. And the integrations for alerting offered many options for notifications for everything I needed. Metrics and Results While the dashboard itself was concise in its information display and clear in its messaging, I did not receive any alerts for the failed test. It was unclear as to whether this was due to incorrect configuration or due to the short duration of the tests (<30 minutes). But without a trigger to draw my attention to this alert, the tool wasn't very helpful. Overall Impression The user interface is very busy and the color scheme is distracting. On the other hand, the focus on the tasks and ease of creating workflows makes navigating the options simple and understandable. The fact that it appears so simple to configure makes it somewhat disappointing that there weren't any escalations performed. 4. Site24x7 Price/mo - $.9 Setup ease - 3 Accuracy - 4 Operability - Pass Notification Channels - 10 APM Integration - Yes offers a suite of software for monitoring everything from Windows servers to Cron jobs. It bills itself as a one-stop-shop for all your monitoring needs with several inclusive monthly plans. Site24x7 The Setup Initially Site24x7 gave me a very easy-to-follow workflow for adding my first monitor, however, every addition thereafter required some prerequisite knowledge. They do offer some tutorials for first-time users, however, the multitude of options can be overwhelming. Once I found the general flow of Third-Party Integrations and Web Page Speed (Browser) toolsets, I was able to select from a plethora of curated and pre-configured notification options. Metrics and Results This tool detected the partial outage from the deployment, which was represented as a large spike in page load time and 500’s from various regions. This provided a good balance of sensitivity to alerting as I was able to see different behaviors depending on the situation. I didn't see any other issues after gathering the remaining metrics from the week. Overall Impression Site24x7 is a bit overcrowded in its functionality causing it to appear opinionated in its approach to workflow. However, with its plethora of customizations, it is a powerful and feature-rich tool. The product lost some points in accuracy. Although both events were marked as "alerting", I didn’t receive any Pagerduty escalations, which caused a delay in troubleshooting. The RCA in the alerts provided a clear screenshot of the failure and a good direction to start investigation. With the extra toolsets available for integrated application monitoring, this could be a powerful tool in your arsenal. 5. Pingdom Price/mo - $1 (or lower as you scale) Setup ease - 5 Accuracy - 4 Operability - Pass Notification Channels - 10 APM Integration - Yes is a well-known product in the SolarWinds family that specializes in synthetic monitoring and user workflow testing. It's been around a long time (about 15 years), is built to be simple and to the point.   With a built-in integration into SolarWinds AppOptics for APM and a broad webhook functionality that ties into most platforms, Pingdom offers multiple integration options. Pingdom The Setup The setup was extremely easy. After only a few clicks and a simple web form to fill out, I could see a summary view of my tests and all the websites I wanted to configure. By selecting "Integrations" in the sidebar, I was able to set up the escalation methods and configure Pagerduty, Slack, and Discord through the webhook interface. Metrics and Results Pingdom caught one prolonged outage, but missed the partial outage triggered shortly before it. This was likely because some regions were reporting healthy while others weren’t during my simulated deployment. Overall Impression I’ve used Pingdom in the past and they’ve only gotten better and more reliable. With a focus on web monitoring, there is no extra clutter, flows are easy to understand, and the overall ease-of-use of the product is high. I rated Pingdom a 4 in accuracy, however, because with my default settings I didn't receive any triggered Pagerduty alerts. I did receive quick and relevant notifications through Slack and Discord with an easy-to-follow root cause analysis as to what was wrong. Because Pingdom provides a carte blanche webhook integration pattern, the integrations (custom and service-based) are nearly endless. By digging through the alert, I was able to get a clear picture as to what the monitors were alerting on and from where, allowing me a direct picture into where the problem might be and letting me understand the nature and impact of the failures. There are also many integrations within the SolarWinds product family, promising Root Cause Analysis pipelines to help me get towards the cause more quickly. 6. DataDog Price/mo - $5 Setup ease - 2 Accuracy - 5 Operability - Pass Notification Channels - 10 APM Integration - Yes is one of the more well-known products on this list and has been around for about 10 years (at the time of this writing). It's an all-inclusive option with robust infrastructure and many options for configuration and customization. With such a repertoire, their motto "See inside any stack, any app, at any scale, anywhere" definitely fits the bill. DataDog The Setup This product was by far the most complex to set up. It is designed with a vast assortment of options and products. Its high price tag comes with a monstrous amount of configurability in terms of its pre-canned integrations, monitoring options, analytics, and dashboarding. The only barrier I encountered to setting up my notification channels was digging through all the options to find the integration I wanted to use. Metrics and Results With the high price tag, DataDog provides the type of data integrity and reporting granularity you would expect. DataDog rapidly notified all of my communication channels, providing clear signals on the who, what, and where the impact had occurred by providing an easy-to-follow link in all channels. Overall Impression Test setup required a deep dive into several product offerings before I ended up in the correct context (which was found under "UX Monitoring", not “Monitors” in the offerings pane). It was abundantly clear that the breadth of offerings in DataDog’s catalog could be integrated and finely tuned to drive not only triage, but automated mitigation with features like code deployment kill switches and API triggered workflows. It’s no wonder that DataDog is such a popular brand in the industry. However, without careful considerations, its cost can quickly overrun budgets. The Final Results Each service has pros and cons, but based on our data we can draw some conclusions and recommend three of these products: Though it falls short in triaging and diagnosing incidents, is the most affordable option for basic notifications. This is an excellent option as a . Updown.IO supplementary service for simple architectures or non-critical applications has a simple workflow with easy-to-understand escalation hooks for alerting. If you’re looking for a product that , this could be a solid, affordable option. But as you move forward into production scenarios, you might need to partner with additional open-source analytics tools to track down details of your application’s behavior. UptimeRobot allows you to hit the ground running early in an application’s lifecycle stands out as the ; it’s easy to create and maintain alerts and the ubiquitous nature of its webhooks allows for easy escalation integrations. Add in the integrations available with the rest of the SolarWinds APM suite, and they are on par with the offerings from DataDog, but at a lower cost. Pingdom best balance in cost and functionality It’s worth noting that I was able to set up this infrastructure and testing for free in each company’s respective trial periods. All the sales teams that reached out to me were also very helpful without being overly invasive, a rare and pleasant trait in our industry. From this experiment, one key takeaway I can recommend is to try them all for yourself and see which is the best fit for your unique use case. Also published at https://dev.to/mbogan/comparing-synthetic-monitoring-products-g3i

Ultimate Guide to Synthetic Monitoring Products

Selenium has been a pinnacle for open-source software in the industry of automated website testing. The automation testing framework is widely adopted by the testing community to help them in automating interactions with their web-application for desktops. I have been an automation tester from couple years now, and have been fondly towards Selenium ever since I knew what it’s capable of. Recently, I was pondering about a few questions though! What would happen if I disable JavaScript and then perform ? How would a website react then? Is it even possible? Is it even required? automation testing with Selenium The only way to know the answers to these questions was to have them tested myself. And I came up with interesting results. Which is why I am writing this article to share these results with you. Things That Can Be Done With JavaScript & Things That Can’t Be! I am sure you must be intrigued to know if there is a need for testing a web application after disabling the JavaScript? However, before I answer that question we need to understand what you can do as a tester with JavaScript & what you cannot! Things You Can Do With JavaScript Access and modify all the content visible on the web page such as text, images, videos or any other kind of private data. Access the cookies sent by the web server. Make request to other servers for data capturing. Things You Can’t Do With JavaScript Accessing files stored in your local system other than those uploaded on a web page. Accessing data from other web pages open in other tabs or on different browsers. Accessing and controlling the hardware capabilities of your system. Accessing any kind of stuff related to extensions and plugins which have been installed. Now that you know the purpose of JavaScript. You may be wondering about the reason for your end user to disable JavaScript in their browsers while surfing the internet? Why Would A User Visit Your Website With JavaScript Disabled? Believe it or not! Some of us actually prefer to surf the internet with JavaScript disabled in our browsers. Why? Well, by disabling JavaScript we aim to achieve an interrupted user-experience of a website’s content. Doing so eliminates of the pop-ups, advertisements, warnings etc.Let us take a scenario to understand this better. Mike, a web developer, is a curious reader who wishes to keep him up-to-date on the latest technologies by reading blogs, webinars, video tutorials. Mike visited your website from search engine and is curious to read your blog around cross browser testing. However, the moment he lands on your website, he encounters a huge pop-up asking him to enroll to your newspaper. He closes the pop-up, clicks on your cross browser testing article, and scrolled further below. Now, he unintentionally clicked on a sponsored content. As a result, a new tab opened which routed him somewhere he never wanted to be. Well, he may feel disappointed with the overall experience of the website. And such pop-ups are quite common to encounter on any website over the internet. Which is why, Mike made sure to disable the JavaScript to ensure he doesn’t encounter more pop-ups, alerts, warnings, advertisements etc. from your website. What do you think Mike would be feeling right now? However, the moment Mike disables JavaScript, your website collapsed entirely! The content rendered in an absurd manner. Your website images with embedded hyperlinks to related articles broke down & started showing the links separately than image. Looks nightmarish isn’t it? Now, it would be impossible for you to stop users like Mike from disabling JavaScript in their browsers. I agree, there won’t be many who would be surfing the internet as Mike. There are some websites that are fully dependent on JavaScript which is really a bad practise and fails to load any resources or makes UX downgraded when JavaScript is disabled. However, it depends entirely on how well you want your business to look like, more importantly to how many. As a best practice, it would be in the best interest to test your website with JavaScript disabled. The best part is that you don’t need to install any plugin or any other third party application in order to disable JavaScript, you have this option in your browser preferences itself. In further sections, I will show you how you can test with JavaScript disabled. However, before we do that, there are some other reasons for you to consider disabling JavaScript as you test your website. Why Testing With JavaScript Disabled Should Be A Part Of Your QA Checklist? Since the main purpose of JavaScript is to bring interactive patterns to a webpage which require higher bandwidth to load and when you have a lower bandwidth connection, it either loads very slow or downgrade the user interaction with the website. So, testing after disabling JavaScript increases your testing speed by avoiding unnecessary JavaScript resources to load and doesn’t fail your script because of web page load failure. As a conclusion to this, you would get your testing results in every short period of time without any chances of getting your test flow disturbed because of any third party resources. Many end users don’t want any kind of advertisements or pop-ups while accessing any website since this kind of stuff makes them distracted from their desirable content. So, many times these kinds of JavaScript resources are closed by the end users while accessing a particular website. This force a website owner to test their website after disabling JavaScript to verify that their users are getting easy accessibility to their website. Also, keep in mind that some websites are fully dependent on JavaScript to make their UI more interactive, testing of such web applications after disabling JavaScript would not make any sense, than it would be better if you go for headless browser testing. Common cross browser compatibility issues for JavaScript can be noticed such as: Increase the testing speed: automated browser testing Ease of accessibility: Cross Browser Compatibility: Browser JavaScript Interpreter is not able to parse and execute JavaScript code. New JavaScript features such as ECMAScript6 / ECMAScript Next and modern Web API fails to work in older browser versions. Handling such JavaScript issues can cause a nightmare for web developers. Hence, it is necessary for testers to perform cross browser testing for verifying how their website renders without JavaScript and then the development team can proceed with the resolution of JavaScript issues. Some developers prefer progressive enhancement technique and some prefer graceful degradation technique for cross browser compatibility testing. You can test your website on LambdaTest with and without JavaScript to know how your web page renders in different scenarios. As discussed, JavaScript is an executable code of a website which gets downloaded to your system local browser whenever we visit the website and then runs. Many advertisements visible on a webpage are basic intent of hackers to spread malware. This kind of online ads are commonly known as malvertising and planting of zombie cookies in the user’s machine. This forces end users who are highly concerned with security to disable the website JavaScript for further accessing. Hence, it becomes necessary now to test a web application for such end users who prefer accessing websites without JavaScript. Now, we will look into the process of disabling JavaScript for website testing. Security: How To Disable JavaScript For Manual Testing I will be demonstrating the process in 2 browsers i.e. Google Chrome & Mozilla Firefox to help you integrate the process in your cross browser testing checklist. I would be using LambdaTest to help me access different browser without going through the trouble of installing them. 1. Google Chrome Testing in Chrome browser has always been a priority for testers. Here is how Google search represents itself by default. Meaning, when JavaScript is enabled. Below are the steps that can help you disabling JavaScript in Chrome: Launch a webpage for which you need to disable JavaScript. Right click on a page and direct to Inspect Elements. Once you get the developer tools open, then press CTRL+SHIFT+P. Type “Disable JavaScript” and click on the first option that says debugger. 2. Mozilla Firefox Similarly to Google Chrome, Here is how Google search represents itself by default with enabled JavaScript. Follow the below steps to disabling JavaScript for website on Mozilla Firefox: Launch a browser and enter “about:config” in URL address bar Click on “I accept the risk!” to see the configurations Enter “javascript.enabled” in search field Double click on “javascript.enabled” available entry to set boolean value as false You can use this for confirming if your JavaScript is enabled or disabled. Note: website How To Disable JavaScript For Automation Testing with Selenium Now, we get down to automation testing with Selenium. Below is the code that helps to disable JavaScript on Chrome and Firefox browser. We have used and class to handle the preferences of the browser. These classes further help in setting and specific capabilities such as browser version, disabling extension, start maximized, start headless and making browser default. ChromeOptions FirefoxOptions ChromeDriver FireFoxDriver Code To Run Automation Testing with Selenium In Mozilla Firefox package DemoAutomation; java.util.HashMap; java.util.Map; org.junit.Test; org.openqa.selenium.By; org.openqa.selenium.JavascriptExecutor; org.openqa.selenium.WebDriver; org.openqa.selenium.WebElement; org.openqa.selenium.firefox.FirefoxDriver; org.openqa.selenium.firefox.FirefoxOptions;

public { @Test()
    public Firefox_javascript_disable() throws InterruptedException {

        System.setProperty( , );
        
        FirefoxOptions options = FirefoxOptions();
        options.addPreference( , );
         
        WebDriver driver = FirefoxDriver(options);
        
        driver.get( );
        driver.findElement(By.name( )).sendKeys( );
        driver.findElement(By.className( )).click();
        
        Thread.sleep( );
        driver.quit();

    }
} import import import import import import import import import class JSdisableFirefox //Disabling JS in Firefox void "webdriver.firefox.driver" "C:\\geckodriver.exe" new "javascript.enabled" false new "https://www.google.com/imghp" "q" "flowers" "Tg7LZd" 5000 Code To Run Automation Testing with Selenium In Google Chrome package DemoAutomation; java.util.HashMap; java.util.Map; org.junit.Test; org.openqa.selenium.By; org.openqa.selenium.JavascriptExecutor; org.openqa.selenium.WebDriver; org.openqa.selenium.WebElement; org.openqa.selenium.chrome.ChromeDriver; org.openqa.selenium.chrome.ChromeOptions;

public { @Test()
    public Chrome_javascript_disable() throws InterruptedException {
        
        System.setProperty( , );
        
        ChromeOptions options = ChromeOptions(); < , > prefs = HashMap< , >();
        prefs.put( , );
        options.setExperimentalOption( , prefs);
        
        
        WebDriver driver = ChromeDriver(options);
        
        driver.get( );
        driver.findElement(By.name( )).sendKeys( );
        driver.findElement(By.className( )).click();
        Thread.sleep( );
        
        
        driver.quit();  
        
        
    }
    
    

} import import import import import import import import import class JSdisableChrome //Disabling JS in Chrome void "webdriver.chrome.driver" "C:\\Users\\Lenovo-I7\\Desktop\\Selenium\\chromedriver.exe" new Map String Object new String Object "profile.managed_default_content_settings.javascript" 2 "prefs" new "https://www.google.com/imghp" "q" "flowers" "Tg7LZd" 5000 Conclusion JavaScript has been an integral part of web development, and it definitely helps to provide us with an eye-appealing website. However, it is important that we test what we build. In my opinion, the results were a bit devastating from UX point of view. Few websites that I tested turn out to be completely blank. Reason being, the website was entirely dependent on JavaScript rendering. Even if the website is partially dependent on JavaScript, it is the responsibility of the tester to test their product with and without JavaScript according to the user perspective. Not to forget with JavaScript disabled will help you ensure a robust website for a wider set of audience. If you are using a cloud-based cross browser testing tool such as LambdaTest, then you get to test on 2000+ real browsers hosted by VM on cloud. So you don’t get to worry about maintaining your own browser library, as we do it for you. Happy testing! 🙂 browser compatibility testing

Is Selenium Automation Testing with Disabled JavaScript Settings Worth Your Time?

One of the benefits of serverless is the pay-per-use pricing model you get from the platform. That is, if your code doesn’t run, you don’t pay for them! Combined with the simplified deployment flow (compared with applications running in containers or VMs) it has enabled many teams to make use of temporary CloudFormation stacks. In this post, let’s talk about two ways you should use temporary CloudFormation stacks, and why. Disclaimer : this shouldn’t be taken as a prescription. It’s a general approach that has pros and cons, which we will discuss along the way. Temporary stacks for feature branches It’s common for teams to have multiple AWS accounts, one for each environment. While there doesn’t seem to be a consensus on how to use these environments, I tend to follow these conventions: is shared by the team, this is where the latest development changes are deployed and tested end-to-end. This environment is unstable by nature, and shouldn’t be used by other teams. dev is where other teams can integrate with your team’s work. This environment should be fairly stable so to not slow down other teams. test should closely resemble production, and would often contain dumps of production data. This is where you can stress test your release candidate in a production-like environment. staging and then there’s production Having one account per environment is considered best practice. Some of my AWS friends would go even further and have one AWS account per developer. Personally, I have never felt the need to have one account per developer. After all, there is some overhead for having an AWS account. Instead, I usually settle for one AWS account per team per environment. However, for a particular project, I would often have a separate deployment CloudFormation stack per developer (but in the same dev account). This is especially useful when I’m working on feature branches. When I start work on a new feature, I’m still feeling my way towards the best solution for the problem. The codebase is still unstable and many bugs haven’t been ironed out yet. Deploying my half-baked changes to the dev environment can be quite disruptive: it risks destabilising the team’s shared environment it’d overwrite other features the team is working on team members would be fighting over (not literally!) who gets to deploy their feature branch to the shared environment Some of these challenges can be mitigated with feature toggles. Different feature branches can be live at the same time and only enabled for the developers working on them. Services like LaunchDarkly is great for this, even if using it with Lambda . requires extra work But what do you do when you need to deploy and test some unfinished changes? That is, the change is not complete and not yet ready to be reviewed and merged back into . Feature toggles won’t help you in this case. master Instead, I can deploy the feature branch to a dedicated environment, e.g. . Using the , that is as easy as running the command . This would deploy all the Lambda functions, API Gateway and any other related resources (DynamoDB, etc.) in its own CloudFormation stack. I would be able to test my work-in-progress feature in a live AWS environment. dev-my-feature Serverless framework sls deploy -s dev-my-feature Having these temporary CloudFormation stacks for each feature branch have negligible cost overhead. There is no traffic in the account since it’s only used by the team. When the developer is done with the feature, the temporary stack can be easily removed by running . dev sls remove -s dev-my-feature However, since these temporary stacks are an extension of your feature branch. They exhibit the same problems when you have long-lived feature branches. Namely, they get out-of-synch with other systems they need to integrate with. Both in terms of the events coming into your function, such as the payloads from SQS/SNS/Kinesis, etc. As well as data your function depends on, such as those that reside in DynamoDB. While it’s not a problem with serverless technologies per se, but I find teams move faster when they use serverless. Which means the problems with long-lived feature branches become more prominent and noticeable as well. Don’t leave feature branches hanging around for more than, say, a week. If the work is large and takes longer to implement, then break it up into smaller features. And when you’re working on a feature branch, integrate from master regularly (no less than once per day). running localstack vs talking to AWS Instead of spending lots of time to get tools such as working, I find it much more productive to deploy a temporary CloudFormation stack in AWS and run against the real thing. localstack The main downsides are: you need an internet connection deploying to AWS is slower than running code locally, which slows down the feedback loop The internet access argument is only relevant for a handful of people who spend most of their time on the road. I travel more than most and do a lot of work while I’m at airports, and internet access is rarely a problem for me. As for the slower feedback loop, it probably feels worse than it actually is. Most of my deployments are less than 30 seconds. But they do feel like an eternity when I’m staring at the screen and waiting for it to be done. To compensate for the loss of feedback loop, I also use tests as well as to run my functions locally while talking to the real AWS services. sls invoke local Temporary stacks for end-to-end tests Speaking of testing, another common use of temporary CloudFormation stacks is for running end-to-end tests. One of the common problems with these tests is that you need to insert test data into a live, shared AWS environment. As a rule of thumb I always: insert the data a test case needs before the test delete the data after the test finishes These help keep my tests robust and self-contained as they don’t implicitly rely on data to exist. They also help reduce the amount of junk that is floating around in the shared environment too. dev However, despite our best intentions, mistakes happen and sometimes we deliberately cut corners to gain agility in the short-term. Over time, these shared environments are filled with test data, which at times interfere with normal operations. As a counter-measure, many teams would employ cron jobs to wipe these environments from time-to-time. An emerging practice to combat these challenges is to create a temporary CloudFormation stack during the CI/CD pipeline instead. The temporary stack is used to execute the end-to-end tests and destroyed afterwards. This way, there is no need to clean up test data, either as part of your test fixture or with cron jobs. The drawbacks are: the CI/CD pipeline takes longer to run you still leave test data in external systems, so it’s not a complete solution You should weigh the benefits of this approach against the delay it adds to your CI/CD pipeline and decide if it’s right for a project. Personally, I think it’s a great approach and I’d encourage more teams to adopt it. However, the more data you have to clean up in external systems (that is, systems that are not provisioned as part of the temporary stack) the less useful it becomes. Summary In summary, here are two ways you can use temporary CloudFormation stacks to improve your development flow for serverless applications: use temporary stacks for feature branches to avoid destabilising shared environments use temporary stacks during CI/CD pipeline to run end-to-end tests to remove the overhead of cleaning up test data These approaches should not be considered as a prescription. You need to consider their pros and cons and see they fit with your constraints and how your teams work. Hi, my name is . I’m an and the author of . I have run production workload at scale in AWS for nearly 10 years and I have been an architect or principal engineer with a variety of industries ranging from banking, e-commerce, sports streaming to mobile gaming. I currently work as an independent consultant focused on AWS and serverless. Yan Cui AWS Serverless Hero Production-Ready Serverless You can contact me via , and . Email Twitter LinkedIn Check out my new course, . Complete Guide to AWS Step Functions In this course, we’ll cover everything you need to know to use AWS Step Functions service effectively. Including basic concepts, HTTP and event triggers, activities, design patterns and best practices. Get your copy . here Come learn about operational for AWS Lambda: CI/CD, testing & debugging functions locally, logging, monitoring, distributed tracing, canary deployments, config management, authentication & authorization, VPC, security, error handling, and more. BEST PRACTICES You can also get off the face price with the code . 40% ytcui Get your copy . here Originally published at https://theburningmonk.com on September 12, 2019.

A Case for Using Temporary Stacks when you do Serverless

Some time ago I was working on a GraphQL project that includes activities and each activity can have some comments with the info of the user that created the comment. The first thing that you might think is that it is a problem of query n + 1 , and yes; it is! I decided to implement dataloaders but for some reason, there was an error on the implementation, so it wasn’t caching the query and the result was a lot of request to the database. After finding that issue I implemented it on the right way reducing the queries to the database from 46 to 6. That’s why I decided to create an open source tool that will help me create queries and make load tests just passing my GraphQL schema. How it works: can be used on two ways for the moment; the first one is using .artillery() with a setup, or the second one is .createQuery() that'll create the queries, so you can use with your favorite load tester. easygraphql-load-tester artillery How to use it? Import package. easygraphql-load-tester Read the schema. Initialize the tester, and pass the schema as the first argument. If there are multiples schemas pass an array with the schemas an argument. The second argument are the arguments on the queries, if there are some of them. only : If an argument is an array it should be passed as an string, e.g: '["name", "name 2"]' Note One schema file 'use strict'

const EasyGraphQLTester = require('easygraphql-load-tester')
const fs = require('fs')
const path = require('path')

const userSchema = fs.readFileSync(path.join(__dirname, 'user.gql'), 'utf8')

const loadTester = new EasyGraphQLLoadTester(userSchema) Multiples schemas files 'use strict'

const EasyGraphQLTester = require('easygraphql-load-tester')
const fs = require('fs')
const path = require('path')

const userSchema = fs.readFileSync(path.join(__dirname, 'user.gql'), 'utf8')
const familySchema = fs.readFileSync(path.join(__dirname, 'family.gql'), 'utf8')

const loadTester = new EasyGraphQLLoadTester([userSchema, familySchema]) Artillery To use with , you must have it installed, in case you don’t have it just run: artillery $ npm install artillery -g index.js You should configure your index.js file: 'use strict'

const EasyGraphQLTester = require('easygraphql-load-tester')
const fs = require('fs')
const path = require('path')

const userSchema = fs.readFileSync(path.join(__dirname, 'schema', 'user.gql'), 'utf8')
const familySchema = fs.readFileSync(path.join(__dirname, 'schema', 'family.gql'), 'utf8')

const args = {
  getMeByTestResult: {
    result: 4
  },
  search: {
    id: '1'
  }
}

const loadTester = new EasyGraphQLLoadTester([userSchema, familySchema], args)

const testCases = loadTester.artillery()

module.exports = {
  testCases
} artillery.yml The artillery file should have this minimum configuration, you can add yours in case it is needed: config:
    target: "http://localhost:5000/"
    phases:
      - duration: 5
        arrivalRate: 1
    processor: "./index.js"
  scenarios:
    - name: "GraphQL Query load test"
      flow:
        - function: "testCases"
        - loop:
            - post:
                url: "/"
                json:
                  query: "{{ $loopElement.query }}"
            - log: "----------------------------------"
            - log: "Query: {{ $loopElement.name }}"
          over: cases In this case the server is running on http://localhost:5000/ How to run it To run you load test, just run: $ artillery run artillery.yml Result The result is going to be something like this if you apply the basic configuration All virtual users finished
 Summary report @ 15:03:05(-0500) 2018-11-17
   Scenarios launched:  5
   Scenarios completed: 5
   Requests completed:  40
   RPS sent: 8.95
   Request latency:
     min: 1.2
     max: 13
     median: 2
     p95: 6
     p99: 13
   Scenario counts:
     GraphQL Query load test: 5 (100%)
   Codes:
     200: 40 load testing one of the queries created if the argument is an array it should be passed as a comment like on the example '["test", “test2”]'. If you like this package don’t forget to give a ⭐️ on . GitHub Repo: https://github.com/EasyGraphQL/easygraphql-load-tester npm: https://www.npmjs.com/package/easygraphql-load-tester : More easygraphql projects https://github.com/EasyGraphQL Website: https://easygraphql.com/

How I started doing load testing on GraphQL without writing a single Query

Introduction: Flow of the program depends on the value of the various variables we use in our code. Depending on the values of the variables in our program, we navigate the flow of execution as we needed / required. For example if we are using any collection types, it is hard to perform logic when the collection is modified or changed. i.e when new items are added, deleted, or modified. We can still manage this kind of scenarios in many ways. One of them is using Notification-Centre, To notify us whenever the change occurs in property value. But if want to check on many properties in our code, this (using Notification Centre) way lead us to heavy chunk of code, to call for all those properties we need to check on. The Other way which is better In this kind of scenarios is (also Apple using this in its libraries a lot) known as (Key Value Observing), which is also directly related to another powerful mechanism called (Key Value Coding). KVO KVC Note: Any property we want to observe for changes must be KeyValueCoding (KVC)complaint. Both of these KVO & KVC, provide an efficient way to write our code. Now lets get started with KVC and then KVO. KVC: is a form of coding that allows you to access an object’s properties indirectly, using strings to access them instead of the property’s accessors or instead of accessing the variables directly. To enable such mechanism, your classes must comply to the NSKeyValueCoding informal protocol. (OR) KVC Key-value coding is a mechanism for accessing an object’s properties indirectly, using strings to identify properties, rather than through invocation of an accessor method or accessing them directly through instance variables. Ex: class Profile: NSObject { var firstName: String var lastName: String var customProfile: Profile } If we want assign the values for the above declared variables, in the class init() or somewhere in the class file, normally we do like the following: self.firstName = “Robert” self.lastName = “Stark” With KVC; we do like the following: self.setValue: “ Robert ” for key: “ firstName ” //self.setValue: Any for key: key/KeyPath self.setValue: “ Stark ” for key: “ lastName ” To retrieve the values of KVC properties we use like the following: let robertLastName = self.value( forKey: “ lastName ” ) The above KVC working way is like working with Dictionaries in swift. Right? Here, In KVC; Instead of directly , or using (#If available) , we are doing in a way simply values to assigning the values to properties setter methods of objects assigning keys/keyPaths. So we use keys and values , this technique is called Key Value Coding(KVC). every class that is defined in the framework and that inherits from conforms to the protocol. Note: There is protocol known as NSKeyValueCoding informal protocol , which is compulsory to work with KVC . Our classes must be confirmed to this protocol, in order to use KVC & KVO . NSObject confirms to this protocol. So Foundation NSObject NSKeyValueCoding What is a key & KeyPath ? Key : simply “ Key ” specifies a single property, the one we want to set a value or get one from . So its name should be the same as the property’s name. Ex: self.setValue: “ Stark ” for key: “ lastName ” KeyPath : A KeyPath is formed with the dot-syntax by following the substrings, so it is not a single word/string. Key-path represents all the properties of an object, which comes in the way until to reach the desired value/property . Ex: var myProfile: Profile self.setValue: “ Baratheon ” for key: “ myProfile. customProfile.lastName ” KVC : Here, we are going to create a single view application, to work with the KVC & KVO. This project has two example projects, but the one we are exploring here is not related with any UI. The other one is updates a UILable on ViewController’s view when the text changes. The Project link will be shared at the bottom, so you can explore easily yourself. First, create a single view application in swift To use KVC our classes need to confirm to NSKeyValueCoding protocol. So by confirming to NSObject, we can achieve this step. UIViewController is already confirms to this NSObject, so We can call the methods from this protocol without any setup. In Xcode, In your project create a new swift file, with the name Children with NSObject as a base class(Children inherits from NSObject). Then In that class file, declare two properties named ‘ and ‘ by placing ‘ ’ keywords at the front of the declaration_._ So why do we need to do this??? name’ age’ @objc dynamic → In swift, there are many keywords/ attributes to help the compiling, runtime specifications, access controlling etc. Ex: @escaping, @available, etc. Likewise, It also defines a range of declaration modifiers, to modify the declarations of properties/class-members. For example, by marking a class declaration with the‘ keyword, we inform the compiler that the class cannot be subclassed. This allows the compiler to make a number of optimisations to increase performance. ‘ is also a declaration modifier we use in swift. final’ dynamic’ , is one of the cool features in Objective-C. It simply means that the Objective-C runtime decides at runtime which implementation of a particular method or function it needs to invoke. For example, if a subclass overrides a method of its superclass, dynamic dispatch figures out which implementation of the method needs to be invoked, that of the subclass or that of the parent class. This is a very powerful concept. Dynamic dispatch Swift uses the Swift runtime whenever possible. The result is that it can make a number of optimisations. While Objective-C solely relies on dynamic dispatch, Swift only opts for dynamic dispatch if it has no other choice. If the compiler can figure out at compile time which implementation of a method it needs to choose, it wins a few nanoseconds by opting out of dynamic dispatch. Swift runtime chooses other options, such as and , over whenever possible. It does this to increase performance.Static and virtual dispatch are much faster than dynamic dispatch. Even though we are talking nanoseconds, the net result can be dramatic. Many features we have come accustomed to are only possible because of the dynamic Objective-C runtime, including Core Data and Key-Value Observing. static virtual dispatch dynamic dispatch Dynamic Dispatch By applying the ‘ declaration modifier to a member of a class, you tell the compiler that dynamic dispatch should be used to access that member. dynamic’ By prefixing a declaration with the ‘ keyword, the declaration is implicitly marked with the attribute. The attribute makes the declaration available in Objective-C, which is a requirement for it to be dispatched by the Objective-C runtime. dynamic’ objc objc ‘ declaration modifier can only be used for members of a class. Structures and enumerations don't support inheritance, which means the runtime doesn't have to figure out which implementation it needs to use. dynamic’ So to use KVC & KVO in swift, for the properties we want to observe in KVO we need to declare them with @objc dynamic keyword. Now, we have two properties in our class, Initialise/define them in initialiser method. Children Now in ViewController class file, declare three Children Instances like the following: First we use of ‘ object. In the viewDidLoad() method, we initialise the child1 object, and then assign the values to its properties. child1’ If you print the‘ objects properties like name and age you will get the assigned values in result. child1’ Now, we will use the KVC methods to do the same thing. In the above snippet, In the first couple of rows we set the desired values to both properties using the method. observe the key strings are the same to the properties’s names. setValue:forKey: Next, we perform the exact opposite task. We extract the values out of the properties using the method, and we assign them to two local variables. And then we printed the values in the console. The result is the same as the previous one. valueForKey: Note: If we give keys different to the property names, The app will crash. When writing KVC-compliant code it’s really important to take care so the key strings actually match to the property names, otherwise the app will simply fall apart. This is not a case when dealing directly with properties, as there’s no chance to do any mistake on their names; the compiler would throw an error in such a case which would drive us to fix it. With all the above, we have managed to see how to write KVC-styled code, and how to set and get values using keys. In the next part we will complete the project. working with key-paths: Now go to the Children class, and add the following property. @objc dynamic var child: Children? in the method. Now, add the next lines that initialise the related objects and assign their initial values: viewDidLoad In the above snippet, in the first couple of rows we just initialised the‘ _child2 ’_object and its ‘ property. Next we set the values to the properties and of . For the property of , we used key-path to set the values. Observe closely. we can retrieve the values to check if the assignment was successful: Uncomment the print statements for that. child’ name age child2 child child2 Now we will see what if the child of the child has a child too… If you want to check the values/result use the print statements for the above snippet. So far, we learned how to write KVC complaint code using keys and key-paths. Next we will learn Observing the Property’s value changes: KVO : Here we will see what actions should be taken in order to be able to track down changes on properties. First of all, let me introduce you as a list the steps needed to implement KVO: 1. The class of which you want to observe its properties must be KVO compliant. That means: The class must be KVC compliant according to what we have already seen in the introduction and in the previous section. The class must be able to send notifications either automatically, or manually (we will see more about that later). 2. The class that will be used to observe the property of another class should be set as . observer 3. A special method named should be implemented to the observing class. observeValue(forKeyPath keyPath: String?, of object: Any?, change: [NSKeyValueChangeKey : Any]?, context: UnsafeMutableRawPointer?) Let’s see everything one by one. The most important thing when we want to observe for changes of a property, is to our class observe for these changes. This is done more or less with as with the casual notifications ( ), but using another method. This method is the make NSNotifications addObserver(<#T##observer: NSObject##NSObject#>, forKeyPath: <#T##String#>, options: <#T##NSKeyValueObservingOptions#>, context: <#T##UnsafeMutableRawPointer?#>) Here we observe the value changes for and properties of a object. So in viewWillAppear() method, add the observers for the child1 object. name age child1 The parameters the above method accepts are: : This is the observing class, usually the object. addObserver self : I guess you can understand what’s this for. It is the string you used as a key or a key path and matches to the property you want to observe. Note that you specify here either a single key, or a key path. forKeyPath : an array of values. options NSKeyValueObservingOptions : This is a pointer that can be used as a unique identifier for the change of the property we observe. Usually this is set to or . We’ll see more about this later. context nil NULL Now that we have made our class able to observe for any changes in the above two properties, we must implement the method. Its implementation is mandatory, and it has one great disadvantage. That is the fact that is called for every KVO change, and if you observe many properties then you must write a lot of statements so as to take the proper actions for each property. However, this can be easily overlooked as the benefits of the KVO are greater than this limitation. observeValueForKeyPath:ofObject:change:context: if The above method will be called every time change in the value of properties which are added to the observer. Here by key-path parameter, we printed the new and old values of the name and age properties. To test this functionality, wire-up an action for a UIButton to your viewController, and in that action method add the following lines of code: Super! After we have set a new value to the and properties of the object, we received the notification, and the messages we asked for to be displayed were shown on the debugger. As you see, both the previous and the new value are included in the dictionary. name age child1 From the dictionary you can extract any value you want (if needed), but the most important of all is that it’s super-easy to be notified about changes in properties. change add the following lines of code in the button action method and run the program. If you observe the result, we receive two notifications regarding changes to the property. But that seems confusing, because even though we know the object that each notification belongs to, programmatically we can do nothing to determine the object that sent the notification. So, how do we face that, and how can we programmatically be a 100% sure about the object that the changed property belongs to? age The answer to the above question is one: We will make use of the argument of the method. I have already mentioned before that the purpose of the context is to uniquely identify a change on a property, so it’s the best tool we have at our disposal. context addObserver(<#T##observer: NSObject##NSObject#>, forKeyPath: <#T##String#>, options: <#T##NSKeyValueObservingOptions#>, context: <#T##UnsafeMutableRawPointer?#>) Here I defined two contexts for each child1 and child2: Note that the context value for each observed property must be a global variable, because it has to be accessible from both the and the methods. addObserver… observeValueForKeyPath… Now modify the code in child1 and child2 add observer methods, by passing the context parameter. And then we need to modify the observe method as well like the following: This way we can identify the changed property with help of passed context parameter. So we managed to programmatically specify each changed property. Lastly and before we reach at the end of this chapter, it’s also quite important at some point to remove the observers you add. There is not a recipe on where you should do that. For instance, in many cases it would be useful to do that in the , after you have handled a received notification. In other cases, you should do so upon the dismissal of a view controller. Generally, it’s up to your application’s structure the decision you will make about that. In this example, we will do it in the method. Here it is: For observeValueForKeyPath:ofObject:change:context: viewWillDissapear: child2, I removed observer in the above snippet. Automatic and Manual Notifications By default, the system sends a notification every time a property gets changed when you observe using KVO. This is suitable in most cases, however there are times that we don’t want to get a notification once a change has happened, but after a bunch of changes have taken place in multiple properties or at a later time. Thankfully, iOS SDK provides us with some quite convenient methods that gives us control over the notifications, so we can manually send them whenever it’s actually needed. Before we get into more details, let me just say that using the method you’ll see right next is not mandatory. On the contrary, you may implement it if and when it is really necessary. Getting into the point now, in order to control the notifications that are sent upon property changes, you must implement the _automaticallyNotifiesObserverForKey:_class method. The parameter it accepts is a string representation of the key of the property for which you need to control the notification, and it returns a boolean value. In case that you don’t want a notification to be sent after the observed property’s value has been changed, then the method must return false. In any other case, you should let iOS decide about the notifications. In practice, let’s suppose that we don’t want a notification to be posted when the property of the class get changed. With that in mind, here’s the implementation of that method in the class name Children Children In the clause, we call the same method using the class in order to let iOS handle all the keys that we haven’t explicitly added here, and the value that we get back is the one that we return at the end. else super If you run the app at this point, you’ll find out that no message regarding the name changing is appeared on the debugger. Of course, this is what we desire, so we’ve managed to achieve our goal. But, have we really done it? Well, as you understand by returning false in the above method for the specific key, we’ve only managed to stop the relevant notifications from being sent. And of course, this doesn’t mean manual notifications, it means no notifications at all! In order to send a notification when we decide so, we must use two other methods. These are the and the . When using them, the must be called first, then the new value must be assigned to the property, while the should be called at the end. To test the manual actions, add these lines in the action method of viewcontroller. willChangeValueForKey: didChangeValueForKey: willChangeValueForKey: didChangeValueForKey: If you run the app now, the message regarding the name change is appeared on the debugger, and that means that we’ve sent the notification manually with success! Actually, the notification is sent after the method is invoked, therefore place that method wherever you feel appropriate for receiving notification. didChangeValueForKey: That’s what exactly we have been expecting from the app! As you can see, we’ve managed to control the notification sending point, and all that with a little effort! Note that between the and the methods, you can have more than one property values assigned. willChangeValueForKey: didChangeValueForKey: The and the methods are not mandatory to be used as shown above. They can be implemented in the class (or in your own class) as well. willChangeValueForKey: didChangeValueForKey: Children Please click for the project describing above tutorial. here References: http://michael-brown.net/2017/swift-and-kvo-context-variables/ https://www.appcoda.com/understanding-key-value-observing-coding/ https://cocoacasts.com/key-value-observing-kvo-and-swift-3 https://www.ralfebert.de/ios-examples/swift/property-key-value-observer/ https://blog.scottlogic.com/2015/02/11/swift-kvo-alternatives.html If you like my tutorials please follow me on . You can contact me through or accounts. medium my-twitter linkedIn Thanks for reading. Will get better soon with more tutorials. See you!!!

KVO & KVC In swift

KVO y KVC en rápido

Photo by on Andres Urena Unsplash Quick guide to building and unit testing an Alexa Skill What is Test Driven Development? According to , it means “Requirements are turned into very specific , then the software is improved to pass the new tests, only.” Basically, you would first have to write the test of the software/feature you are developing before you start working on the developing the software/feature itself. Wikipedia test cases Here are a few more articles on the benefits and why you should apply TDD:- by - by Test Driven Development Jan Olbrich Isn’t TDD twice the work? Why should you care? Navdeep Singh Preparation Here are a few thing you might want to have set up or installed before getting started: account (a free one will work just fine) Amazon Web Service (personally though, I prefer installing and maintaining it through ) node.js nvm Text editor of your choice Setting up Create a new project folder ( ) mkdir project-name Navigate into that new folder ( ) cd project-name Initialize npm ( ) npm init Follow through everything as you prefer (if you don’t know what it is, just press enter and it’ll keep the default) except for , put in instead. The command line should look something like the snippet below. test command: node test/testflow.js This utility will walk you through creating a package.json file.It only covers the most common items, and tries to guess sensible defaults. See `npm help json` for definitive documentation on these fieldsand exactly what they do. Use `npm install <pkg>` afterwards to install a package andsave it as a dependency in the package.json file. Press ^C at any time to quit.package name: (emptyproject)version: (1.0.0)description:entry point: (index.js)test command: node test/testflow.jsgit repository:keywords:author:license: (ISC) Now you have node.js setup for the project. Unit testing Shout out to for maintaining that provides unit testing for Alexa skills. Here’s what the following commands will do : robmccauley testflow Clone testflow repository into your project at the ‘test’ folder. (If this project is also a git project itself, I recommend doing instead of .) git submodule add git clone Create a folder named ‘dialogs’ Create a file named ‘default.txt’ in the ‘dialog’ folder Edit the ‘SourceCodeFile’ line in the cloned ‘testflow’ repository to point to the ‘index.js’ in the base level of the folder (feel free to edit it to your personal preference). git clone :robm26/testflow.git testmkdir dialogstouch dialogs/default.txtsed -i '9c const SourceCodeFile = "../index.js"' test/testflow.js git@github.com Inside the ‘default.txt’ file in the ‘dialogs’ folder, you should have the intents you are trying to test. The default in the testflow repository consist of the followings but you should definitely add some more customized ones to it depending on what you are trying to do in your skill. LaunchRequestAMAZON.HelpIntentAMAZON.StopIntent In case where you are taking in variables through utterances, you can do something like this : DoSomething Input1=userInput1 Input2=userInput2 To get a deeper understanding into using testflow, I recommend looking into its and the by the author himself. tutorial page blog post Developing the skill To be honest, I don’t have too much to talk about on this topic. Here is some sample code of how a sample skill can look like. (Also remember to do .) npm install --save alexa-sdk I recommend looking into the official that provides all kinds of sample skills that you can work on top of. Alexa GitHub repository Deployment Alexa Skill Kit Go to and select ‘Create Skill’. In there you should see options to ‘add intents’ and ‘custom slot types’. You should add the appropriate slot types and intents accordingly from above. After you are done with that, select ‘Endpoint’ from the side bar and select ‘AWS Lambda ARN’ as the skill’s service endpoint. Make a copy of the Skill ID as you will need it later. this page AWS Lambda Create an AWS Lambda function selecting ‘from scratch’. After that, you should have an option to ‘add trigger’ where you would select ‘Alexa Skills Kit’. Now in the configuration dialog, you should put in the Skill ID you took a copy of previously then select ‘Add’. After this, select back to the box that labeled your project name. There should be a ‘Function code’ dialog box appeared below. While you can definitely copy and paste your code onto the online text editor, there might be chance where the packages you have installed and used in your code is included by default. It is also possible that you have more than 1 JavaScript files for the skill. In this case, you would select ‘Upload a .ZIP file’ under ‘Code entry type’. Locally, zip up all the JavaScript files along with the folder then upload the resulting zip file. node_modules Submission When you are done, you can go back to the Alexa Skill Kit page, select the ‘Distribution’ tab and fill out the appropriate information before submitting your skill for review. Hopefully everything goes well and your skill gets published at the Alexa Skill Store! About me I recently started working at Facebook as a Software Engineer. I spend a lot of my free time experimenting and building new things with technologies I find fun and interesting. Follow my exploration journey or on . here GitHub Credits Build Skills with the Alexa Skills Kit TestFlow: Simulate Conversations with Your Alexa Skill Code to Ease Debugging

Test Driven Development with Alexa SDK

This week I’m on a short break from school for the holidays and one of my goals for the week has been to get comfortable with the . is my social media of choice and it also holds buckets of data for athletes, which makes it an interesting datasource to build an application off of. The best part about the API is how good their documentation is. It is well organized, provides generic curl examples and describes the API interactions in a clear way that is easy for a beginner like me to understand. Strava API Strava Strava programmer The first feature I wanted to build was to allow a user to create an account on my app, then allow them to authenticate that account with their own profile on Strava. Additionally, I needed to work out how to test this process. I had already messed around a little with using Faraday to access the API through my command-line, but the production app will need a full test suite. Before we get into testing let’s look at the Strava API authentication flow. Strava Authentication Flow The the flow very well: API docs outline Redirect user to the Strava authentication URL to sign-in and view the authorization page. A few parameters are passed in the URL to identify the app and give Strava a url to redirect back to. If the user authorizes the app, then Strava uses the provided url to redirect back to the app and passes a code as a parameter. If the user cancels the authorization they are still redirected back to the app, but are not given a code. The app must then take that code, along with the app ID and app secret token, then send it back to Strava. If the code, app ID and app secret token are all valid, then Strava returns a user authentication token along with the user’s basic profile. My app then saves the user authentication token as well as the Strava profile ID in the user profile. Test Environment Setup Make sure the test environment database is setup (I’m using PostreSQL) and it is migrated. These are the gems I’m using to contact the API and run my test suite: — Creates the API calls for me and manages the additional params I need to pass to the API Faraday — Parses the JSON responses from the API into OpenStruct objects to allow the response to be access with basic Ruby instance methods JSON — Command line debugging tool (default to rails) Byebug — RSpec Testing Framework for Rails RSpec-Rails —Feature testing tool that allows me to interact with my site like a user would Capybara — For debugging allows me to use ‘save_and_open_page’ which lets me see what Capybara sees Launchy — Let’s me reset my database for each test condition Database_Cleaner — Cool gem that allows capybara to visit foreign pages outside my app Capybara-Mechanize These all live inside my Gemfile. I have Faraday and JSON in the main gem list. Everything else is inside my development & test group: The and gems need a little bit of configuration in order to work correctly, so inside of my file I’ve added these lines: database_cleaner capybara-mechanize rails_helper.rb Test Script Setup At this point, my app allows a user to create a new account with their name, email and password. Additionally, users are required to be signed in to add Strava to their account and they can only add it from their personal user/show page. Let’s go through the test setup line by line to show how I’m doing things. Lines 1–3: These are basic describe/context blocks except for line #3. Here I specify what driver I want Capybara to use. By default, Capybara uses the Rack driver, which doesn’t allow the test suite to access any outside domains. By including the capybara-mechanize gem I can now specify the driver to be mechanize, which does allow capybara to visit outside domains. This is useful, because the default driver works fine for most cases and I don’t know what kind of side affects using the mechanize driver would have on the rest of my test suite. Lines 4–9: Creates a basic user profile and mock as this profile, nothing too special here. Note that I’m using instead of . This way I get an error message if the fails. current_user create! create create Lines 11–15: Go to this user’s show page and expect to see a link to . This is step 1 in the Strava Authentication Flow. Additionally, I’m demonstrating that the user does not have a or . These verifications could also belong in the user model test, but I put them here just to make sure everything is working as expected. “Add Strava to Account” strava_athlete_id strava_access_token Line 17–18: Click link to . This will send me to . If I’m not using mechanize I get the error message below. Capybara ignores the protocol and domain, then expects a route to be present for /oauth/token. “Add Strava to Account” https://www.strava.com/oauth/token I can use Launchy here to see what Capybara sees after clicking by inserting ‘ ’ on line 18. Turns out I’m redirected to a login page for Strava. I need to login to my account in order for Capybara to go through the authorization process. ‘Add Strava to Account’ save_and_open_page Lines 19–22: The Capybara methods still work on external websites and can interact with those pages. I inspected the login page to see how strava named the email and passwords fields. Next, I set environment variables in my terminal to store my email/password combo for my test environment. This is important because I don’t want to be posting my test environment credentials all over the internet when I’m posting here or on github. These can be set with an export command in the terminal. export STRAVA_TEST_ENVIRONMENT_EMAIL=test@email.comexport STRAVA_TEST_ENVIRONMENT_PASSWORD=12345 Line 24: After submitting the login credentials on line 22, I put another ‘save_and_open_page’ on line 23 to see where I’m redirected to (see page below). I see that I’m now at the authorize page, so I want Capybara to click ‘Authorize’. This is step 2 of the Strava Authentication Flow. Lines 26–29: This is where my app does a little magic under the hood and performs steps 3–5 in the Strava Authentication Flow. The end result is that I expect to be redirected back to the user show page and for the user to now have their & saved. One thing to note here, I was originally calling instead of and my test was failing even though the user was getting it’s credentials saved. Turns out, was still associated with the state of user that I assigned it on line 4, so I needed to pull the user directly from the database. strava_athlete_id strava_access_token user.strava_athlete_id User.find(user.id).strava_athlete_id user Conclusion This is probably the longest test script I’ve ever written, but that is expected when I’m testing a process with so much user interaction. If there are better ways to test this process let me know in the comments. Figuring out this test took me way longer than I’d like to admit, so if there is an easier way to do it I’d be all over that.

How to Test API Authentication in Rails

Test Driven Development is a coding practice where you write a test first then write the code to pass that test, usually in short iterative cycle. Test Driven Development(TDD), was popularized by . TDD is one of the main techniques followed in his software development methodology. Kent Beck Extreme Programming Now let’s visualize TDD in steps: Write a test (enough to make it fail) Run it, and see it fail. Write the code. Run the test again and see it pass. Repeat Step 1 So now you can see that TDD is a closed loop process. A programmer is immersed into a flow that keeps him tied into the practice of either writing a test or writing the feature implementation code. “So what are the benefits?” you may ask. There are several benefits to following a TDD approach. It helps keep the distance between what you know works and what doesn’t in your code very thin. You can pretty much figure out what went wrong, since you had the tests working perfectly a few seconds ago. It helps to minimize the time needed to refactor your code, since you can easily test if something breaks when you do refactor. It makes adding new features that much easy, since you can change code to accommodate new features very easily. It makes you confident as a programmer. You do not have to fear the code anymore. This is due to the above points 2 and 3. You can easily add new features and refactor your code without worry. It helps to break down software development into chunks that you can manage. So long gone are the fear of starting out on a new feature, since the TDD loop is short enough to easily get started. It helps to stop the exponential cost of change as the software grows, since you can add features without it taking more time. One very good talk regarding this is by . Min-maxing Software Costs Konstantin Kudryashov In the talk Konstantin talks about the exponential increase in cost of change(adding new features) as project time goes on if there are no tests. Exponential cost of change without tests But if there are tests, the cost of change gets capped, making it much easier to add new features. Capped cost of change with tests There are of course some disadvantages too. It is not easy to get started with TDD. It requires you to know a lot of new practices and techniques. Example: unit testing, mocks, assertions etc. It takes more time upfront when doing the development, since you are testing your code as you write. One interesting series of debate is the ? series by , and David argues that TDD is not suitable for all types of coding styles. And argues that TDD has actually introduced more problems that it solves. Is TDD Dead Martin Fowler Kent Beck David Heinemeier Hansson . But all in all, I prefer TDD since it has much more upsides and very little downsides. I say, TDD is actually essential if you want to maintain your code base for a long time. If you are just experimenting with your code and do not need it for a longer term, you may not need TDD in that case. So what does the Test Driven Development consist of? Well, there is the unit test that you write before you write most of any new code. Some of the code we write actually are tested with integration tests. So for code that interacts with third party API or library/database etc, we write integration tests instead of unit tests. Don’t worry, we will go through each type of tests in detail soon on the upcoming parts. Let’s look at the different types of tests in brief: Unit testing is the lowest level of testing you can do. It is usually testing a method inside a class. Unit tests do not interact with other classes directly, but instead with mocks. This makes unit tests isolated and easy to debug and refactor. Unit Testing: Integration testing touches more than one class. Hence, it tests the integration between classes i.e dependencies. It is used to test if the database is giving us the correct results, if an external API is providing us with correct data etc. It tests the real classes and functionalities rather than using mocks. It is significantly slower compared to unit tests to run, since they interact with databases and external providers. Integration Testing: Functional testing is testing a whole feature which may call a lot of dependencies. Typically you would test a route for a correct response, or a Controller method that relates to a certain feature in the application. They are slower than integration tests as they touch a lot more dependencies. Functional Testing: Acceptance testing is the highest level of testing. It only cares if the feature works through the vantage point of customers. The test flow goes through the website clicking and submitting forms and expecting correct results. We use tools like for this purpose. Acceptance Testing: Selenium In the next part we will go through how to setup and get started with unit testing. We will first do it without following TDD approach. This is because it will be hard to grasp both concepts while just starting to learn how to test. We will follow TDD once we are comfortable with writing tests. So we’ll save that for a later part. :) PHPUnit Hope you enjoyed the article. Don’t forget to hit the 👏 icon below. And subscribe for more!

PHP Test Driven Development Part 1: Introduction

I’m a developer. I like text editors. I like code. I like markup. Like many 90s kids, my early skills were forged in the fires of , and . Finding the right mix of WYSIWYG (What you see is what you get) web development seemed to be the theme of the decade. Since then, the consensus for UI work has moved aggressively towards written . Adobe Dreamweaver Microsoft FrontPage, GeoCities markup On one hand, we have and doing great things with WYSIWYG. Despite that, most developers choose to write their own user interfaces. The elegance, the speed, the simplicity, the hotkeys. For my part, I just don’t like dragging and dropping things with unsteady hands. Wix Squarespace Inc. It’s for this reason that I experimented recently with the goal of text-based, browser-rendered flowcharts. A web search brought me to a number of sophisticated WYSIWYG tools like , , and . For founders and creatives alike, I don’t doubt the power of these tools. It’s just that I wanted the developer-friendly solution. I wanted text input, default colors, and default layout. LucidChart Creately Draw.io Enter . This was the library I wanted. It had a simple, text-based data schema that could be consumed by the library. The sample routine on the site looks something like this: flowchart.js JavaScript flowchart.js st=>start: Starte=>endop1=>operation: My Operationsub1=>subroutine: My Subroutinecond=>condition: Yesor No?io=>inputoutput: catch something... st->op1->condcond(yes)->io->econd(no)->sub1(right)->op1 And it produces: I was extremely happy with the outcome. No more drawing lines, no more determining how to draw a shape, no more deciding relative size and distance. Learning the specifics of the data schema takes a few minutes. It’s elegant and sophisticated enough for my use cases. Here is a more complicated example from the site: flowchart.js st=>start: Start|past:> ]e=>end: End|future:> op1=>operation: My Operation|pastop2=>operation: Stuff|currentsub1=>subroutine: My Subroutine|invalidcond=>condition: Yesor No?|approved:> c2=>condition: Good idea|rejectedio=>inputoutput: catch something...|future http://www.google.com[blank http://www.google.com http://www.google.com st->op1(right)->condcond(yes, right)->c2cond(no)->sub1(left)->op1c2(yes)->io->ec2(no)->op2->e With the configuration styles, it produces: Flowcharts are an incredibly powerful way to model user experience and product flow. Developers should keep a process like this handy in order to dispel present or future arguments. Product people and designers should consider the possibility of moving to text-based flowcharts. provides loads of configuration options for colors and appearance. While I encourage you to explore these, they are outside of my use case. My job is building products and stopping arguments. Haven’t seen a case where black & white couldn’t do the job. Flowchart.js For anyone attempting to create a quick, text-based flowchart, I have created a simple web application at . I was using the seed project locally, so it made sense to open up the use case. textflowcharts.com For anyone attempting to replicate the project, I have assembled a seed project . Clone or download the repo. Run a quick or then and you’ll be off to the races. The project pulls data from the data/sample.txt file. You should edit that to match your flow. here npm install yarn, npm start I welcome any contributions to the project. It’s very simple, and I’d like the keep it that way. My hope is that developers, designers, and product people find a use case for the seed. Special thanks , creator of flowchart.js. It’s a very awesome project and I am glad he built it. Adriano Raiano

Stories, News & Mentions about TESTFLOW

Testflow’s Stories on HackerNoon