Automated Security Testing for JS Apps

Rate this content
Bookmark

Traditional security testing for JS apps has focused on the front-end, but actual security issues most often lie in the backing REST API. Join StackHawk co-founder Scott Gerlach for a quick overview of why you need to rethink how you test your JS apps and how StackHawk can help you find and fix security bugs fast.

This talk has been presented at TestJS Summit 2022, check out the latest edition of this JavaScript Conference.

FAQ

Yes, StackHawk allows developers to run the same AppSec tests locally as in CI, enabling them to identify, fix, and validate security issues before code is pushed to the CI/CD pipeline.

StackHawk adapts to modern JavaScript applications by using industry standards like postman collections, OpenAPI spec, and GraphQL introspection queries to directly drive the API, ensuring thorough and accurate security testing.

Legacy DAST struggles with JavaScript front ends as it fails to effectively interpret and test dynamic elements, leading to prolonged scans, false positives, and incomplete coverage especially when it comes to APIs.

A robust DAST tool should offer capabilities to run anywhere (CI/CD, production, localhost), provide real test data, run custom tests for security risks like broken access control, and be adaptable to scan various application types including SPAs and APIs.

StackHawk provides a simple platform that triages findings with clear descriptions and examples, offers tools like curl commands for issue replication, and integrates seamlessly with CI/CD pipelines to ensure security issues are addressed promptly.

Yes, StackHawk supports integration with most major CI tools and can be used with any CI system that can run Docker or a Java process, as detailed in their documentation.

StackHawk is a company focused on application security testing, specifically dynamic application security testing (DAST), helping developers find and fix security issues in their applications.

DAST helps identify and prioritize security issues that are discoverable and likely exploitable in a running application, allowing developers to focus their efforts on critical fixes.

Scott Gerlach
Scott Gerlach
9 min
03 Nov, 2022

Comments

Sign in or register to post your comment.
Video Summary and Transcription
At StackHawk, we do application security testing, specifically dynamic application security testing. Legacy DAST tools are not effective for testing JavaScript front ends and APIs. To achieve better testing, it is essential to drive the API directly using industry standards like postman collections, OpenAPI spec, GraphQL, and introspection queries. StackHawk simplifies finding and fixing security issues in applications, integrating with CI/CD processes and providing simple descriptions and examples. Start a free trial at stackhawk.com to improve software quality.

1. Introduction to DAST and Legacy Scanners

Short description:

At StackHawk, we do application security testing, specifically dynamic application security testing. DAST can help you identify and prioritize your time on what to fix. It can help you find app set bugs that are discoverable, likely exploitable in your running code. Let's look at an example of how legacy DAST scanners are ineffective when testing JavaScript front ends and APIs.

Hey, Test.js Summit. How are you? I'm Scott Gerlach, CSO and co-founder here at StackHawk. Thanks for taking time to check out StackHawk. I hope you're learning a ton of new things at Test.js Summit, and hopefully I can teach you one more.

At StackHawk, we do application security testing, specifically dynamic application security testing. Let's talk about the benefits of DAST. DAST can help you identify and prioritize your time on what to fix because it helps identify what's discoverable and likely exploitable in your running application. If you're awash in a deluge of NPM audit tasks, and it's a good idea to go after those. But often the list is long and not everything is a straight version upgrade. But also, how do you know the code that you wrote is safe? And where should you be spending your time if the upgrade path on NPM audit isn't straightforward? This is the superpower of DAST.

DAST can help you find app set bugs that are discoverable, likely exploitable in your running code. You might be thinking to yourself, but frameworks have basically prevented any of the apps that problems from happening. And yes, many frameworks have done a good job of preventing issues like SQL injections and cross-site scripting. But most all of them have the unsafe version of that to help you do your complicated things and unfortunately make mistakes. But some people don't know about DAST and those that do may have run into the problem with DAST.

Let's look at an example. Back in the old days when we built server side applications that ran the data layer and the presentation layer, everything was fine and dandy. The legacy DAST scanner could scan and test the legacy application without many problems. You get good results, identify some serious AppSec bugs and everything was hunky dory. But then something changed. Then we started building JavaScript front ends and the JavaScript front end trolled the legacy DAST scanner and I mean, trolled it. For instance, hey, when does page scrolling end? It doesn't. Where are all the forms? It depends. Legacy DAST was running along, it was happy, totally assuming it was getting all the info it needed to test these new applications. The results were terrible. Scans took forever, false positives for days, et cetera. And the worst part, there was someone else in that back seat as well. Our backing APIs are in there controlling all the data, talking to the data store backends, helping to render elements on the page and the legacy DAST scanner thinks the front end is passing all these requests to the backend. Do we end up testing the API here? No. Are we covering the API, the whole API? Probably not.

2. DAST and API Testing

Short description:

Legacy DAST tools are not effective when it comes to testing JavaScript front ends and APIs. To achieve better testing and results, it is essential to drive the API directly using industry standards like postman collections, OpenAPI spec, GraphQL, and introspection queries. Testing the front end in cookie settings and DOM XSS can also uncover potential security bugs. Key features to look for in a dynamic app set testing tool include the ability to run anywhere, provide real test data, and run custom security tests. By focusing on these aspects, you can ensure faster and more accurate AppSec testing.

Are we even making simple requests to the API? Good old JavaScript front end. It depends. It depends on the browser or browser emulator the legacy DAST tool is using and how well it's driving. What elements it can see, what it can render. If you've built support into your JavaScript application front end for specific versions of specific browsers. Now you can think of this sort of like Selenium scripts. And in Selenium scripts, you write a specific test. I wanna go to this page and then I wanna click on this button and then this should show up, right? That kind of Selenium test.

DAST is like that, except for you're expecting it to find all of the possible user input paths by itself and do a good job. It's just not gonna happen. It doesn't work well. So how can we get back to better testing, better results, faster, more accurate scans, uncovering these application security bugs that are built into our JavaScript apps now? The key here is driving the API directly. Using industry standards like postman collections, OpenAPI spec, GraphQL, introspection queries, you can have direct access to the API, understand what it does and the data it's controlling and get fast, thorough tests. Nevermind if you're building an API that doesn't have a front-end at all. Mind blown. There's still good things to find in testing the front end in cookie settings and DOM XSS. Protecting all the data that you could end up potentially putting at risk is a better place to start.

What are some of the keys to look for in a dynamic app set testing tool that will help you test APIs directly? First of all, run anywhere. Should run in your CICD, should be able to run against production, but really importantly, should be able to run your local host as you're developing. Should be able to provide real test data, so in the screenshots that we've got over here, we've got the Faker library turned on so that Faker is providing data. We've actually typed in data for some values. Lots of different options to be able to say, hey, API, here's what real data looks like. Also use that with your security tests. Run custom tests for broken access control and insecure direct object access. These are two of the top 10 OWASP API security things, and they're hard to test for without knowledge about how the API works. As you're developing the API, you can write things like tenancy checks, can customer A see customer B's data. Look for stuff like, can a regular user get into the admin functions? Those are some of the really hard things to test for. Now you can write that test once and keep running it over and over and over again to make sure that the API stays secure. Like I said, you should be looking for something that's built to scan modern applications, including server side applications, single page apps, REST APIs, GraphQL APIs and SOAP APIs. All of this leads to faster AppSec testing, faster time to fix and faster getting back to your regular work of building value in the application they're building.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Scaling Up with Remix and Micro Frontends
Remix Conf Europe 2022Remix Conf Europe 2022
23 min
Scaling Up with Remix and Micro Frontends
Top Content
This talk discusses the usage of Microfrontends in Remix and introduces the Tiny Frontend library. Kazoo, a used car buying platform, follows a domain-driven design approach and encountered issues with granular slicing. Tiny Frontend aims to solve the slicing problem and promotes type safety and compatibility of shared dependencies. The speaker demonstrates how Tiny Frontend works with server-side rendering and how Remix can consume and update components without redeploying the app. The talk also explores the usage of micro frontends and the future support for Webpack Module Federation in Remix.
Full Stack Components
Remix Conf Europe 2022Remix Conf Europe 2022
37 min
Full Stack Components
Top Content
RemixConf EU discussed full stack components and their benefits, such as marrying the backend and UI in the same file. The talk demonstrated the implementation of a combo box with search functionality using Remix and the Downshift library. It also highlighted the ease of creating resource routes in Remix and the importance of code organization and maintainability in full stack components. The speaker expressed gratitude towards the audience and discussed the future of Remix, including its acquisition by Shopify and the potential for collaboration with Hydrogen.
Debugging JS
React Summit 2023React Summit 2023
24 min
Debugging JS
Top Content
Watch video: Debugging JS
Debugging JavaScript is a crucial skill that is often overlooked in the industry. It is important to understand the problem, reproduce the issue, and identify the root cause. Having a variety of debugging tools and techniques, such as console methods and graphical debuggers, is beneficial. Replay is a time-traveling debugger for JavaScript that allows users to record and inspect bugs. It works with Redux, plain React, and even minified code with the help of source maps.
Making JavaScript on WebAssembly Fast
JSNation Live 2021JSNation Live 2021
29 min
Making JavaScript on WebAssembly Fast
Top Content
WebAssembly enables optimizing JavaScript performance for different environments by deploying the JavaScript engine as a portable WebAssembly module. By making JavaScript on WebAssembly fast, instances can be created for each request, reducing latency and security risks. Initialization and runtime phases can be improved with tools like Wiser and snapshotting, resulting in faster startup times. Optimizing JavaScript performance in WebAssembly can be achieved through techniques like ahead-of-time compilation and inline caching. WebAssembly usage is growing outside the web, offering benefits like isolation and portability. Build sizes and snapshotting in WebAssembly depend on the application, and more information can be found on the Mozilla Hacks website and Bike Reliance site.
Webpack in 5 Years?
JSNation 2022JSNation 2022
26 min
Webpack in 5 Years?
Top Content
In the last 10 years, Webpack has shaped the way we develop web applications by introducing code splitting, co-locating style sheets and assets with JavaScript modules, and enabling bundling for server-side processing. Webpack's flexibility and large plugin system have also contributed to innovation in the ecosystem. The initial configuration for Webpack can be overwhelming, but it is necessary due to the complexity of modern web applications. In larger scale applications, there are performance problems in Webpack due to issues with garbage collection, leveraging multiple CPUs, and architectural limitations. Fixing problems in Webpack has trade-offs, but a rewrite could optimize architecture and fix performance issues.
Towards a Standard Library for JavaScript Runtimes
Node Congress 2022Node Congress 2022
34 min
Towards a Standard Library for JavaScript Runtimes
Top Content
There is a need for a standard library of APIs for JavaScript runtimes, as there are currently multiple ways to perform fundamental tasks like base64 encoding. JavaScript runtimes have historically lacked a standard library, causing friction and difficulty for developers. The idea of a small core has both benefits and drawbacks, with some runtimes abusing it to limit innovation. There is a misalignment between Node and web browsers in terms of functionality and API standards. The proposal is to involve browser developers in conversations about API standardization and to create a common standard library for JavaScript runtimes.

Workshops on related topic

Master JavaScript Patterns
JSNation 2024JSNation 2024
145 min
Master JavaScript Patterns
Top Content
Featured Workshop
Adrian Hajdin
Adrian Hajdin
During this workshop, participants will review the essential JavaScript patterns that every developer should know. Through hands-on exercises, real-world examples, and interactive discussions, attendees will deepen their understanding of best practices for organizing code, solving common challenges, and designing scalable architectures. By the end of the workshop, participants will gain newfound confidence in their ability to write high-quality JavaScript code that stands the test of time.
Points Covered:
1. Introduction to JavaScript Patterns2. Foundational Patterns3. Object Creation Patterns4. Behavioral Patterns5. Architectural Patterns6. Hands-On Exercises and Case Studies
How It Will Help Developers:
- Gain a deep understanding of JavaScript patterns and their applications in real-world scenarios- Learn best practices for organizing code, solving common challenges, and designing scalable architectures- Enhance problem-solving skills and code readability- Improve collaboration and communication within development teams- Accelerate career growth and opportunities for advancement in the software industry
Integrating LangChain with JavaScript for Web Developers
React Summit 2024React Summit 2024
92 min
Integrating LangChain with JavaScript for Web Developers
Featured Workshop
Vivek Nayyar
Vivek Nayyar
Dive into the world of AI with our interactive workshop designed specifically for web developers. "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" offers a unique opportunity to bridge the gap between AI and web development. Despite the prominence of Python in AI development, the vast potential of JavaScript remains largely untapped. This workshop aims to change that.Throughout this hands-on session, participants will learn how to leverage LangChain—a tool designed to make large language models more accessible and useful—to build dynamic AI agents directly within JavaScript environments. This approach opens up new possibilities for enhancing web applications with intelligent features, from automated customer support to content generation and beyond.We'll start with the basics of LangChain and AI models, ensuring a solid foundation even for those new to AI. From there, we'll dive into practical exercises that demonstrate how to integrate these technologies into real-world JavaScript projects. Participants will work through examples, facing and overcoming the challenges of making AI work seamlessly on the web.This workshop is more than just a learning experience; it's a chance to be at the forefront of an emerging field. By the end, attendees will not only have gained valuable skills but also created AI-enhanced features they can take back to their projects or workplaces.Whether you're a seasoned web developer curious about AI or looking to expand your skillset into new and exciting areas, "Hands-On AI: Integrating LangChain with JavaScript for Web Developers" is your gateway to the future of web development. Join us to unlock the potential of AI in your web projects, making them smarter, more interactive, and more engaging for users.
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
React Day Berlin 2022React Day Berlin 2022
86 min
Using CodeMirror to Build a JavaScript Editor with Linting and AutoComplete
Top Content
WorkshopFree
Hussien Khayoon
Kahvi Patel
2 authors
Using a library might seem easy at first glance, but how do you choose the right library? How do you upgrade an existing one? And how do you wade through the documentation to find what you want?
In this workshop, we’ll discuss all these finer points while going through a general example of building a code editor using CodeMirror in React. All while sharing some of the nuances our team learned about using this library and some problems we encountered.
Hands-on with AG Grid's React Data Grid
React Summit 2022React Summit 2022
147 min
Hands-on with AG Grid's React Data Grid
Top Content
WorkshopFree
Sean Landsman
Sean Landsman
Get started with AG Grid React Data Grid with a hands-on tutorial from the core team that will take you through the steps of creating your first grid, including how to configure the grid with simple properties and custom components. AG Grid community edition is completely free to use in commercial applications, so you'll learn a powerful tool that you can immediately add to your projects. You'll also discover how to load data into the grid and different ways to add custom rendering to the grid. By the end of the workshop, you will have created an AG Grid React Data Grid and customized with functional React components.- Getting started and installing AG Grid- Configuring sorting, filtering, pagination- Loading data into the grid- The grid API- Using hooks and functional components with AG Grid- Capabilities of the free community edition of AG Grid- Customizing the grid with React Components
Testing Web Applications Using Cypress
TestJS Summit - January, 2021TestJS Summit - January, 2021
173 min
Testing Web Applications Using Cypress
Top Content
WorkshopFree
Gleb Bahmutov
Gleb Bahmutov
This workshop will teach you the basics of writing useful end-to-end tests using Cypress Test Runner.
We will cover writing tests, covering every application feature, structuring tests, intercepting network requests, and setting up the backend data.
Anyone who knows JavaScript programming language and has NPM installed would be able to follow along.
Building GraphQL APIs on top of Ethereum with The Graph
GraphQL Galaxy 2021GraphQL Galaxy 2021
48 min
Building GraphQL APIs on top of Ethereum with The Graph
WorkshopFree
Nader Dabit
Nader Dabit
The Graph is an indexing protocol for querying networks like Ethereum, IPFS, and other blockchains. Anyone can build and publish open APIs, called subgraphs, making data easily accessible.

In this workshop you’ll learn how to build a subgraph that indexes NFT blockchain data from the Foundation smart contract. We’ll deploy the API, and learn how to perform queries to retrieve data using various types of data access patterns, implementing filters and sorting.

By the end of the workshop, you should understand how to build and deploy performant APIs to The Graph to index data from any smart contract deployed to Ethereum.