--- title: "Understanding JS Steps in Autify | Autify Guide" slug: "javascript-steps" description: "Learn How to Utilize JavaScript Steps for Advanced Automation Testing in Autify. Start Your Free Trial!" updated: 2024-10-23T03:58:14Z published: 2024-10-23T03:58:14Z canonical: "help.autify.com/javascript-steps" --- > ## Documentation Index > Fetch the complete documentation index at: https://help.autify.com/llms.txt > Use this file to discover all available pages before exploring further. # JS Steps We like to say that we are a no-code solution. However, that does not mean that you can’t code! You can cover a broad spectrum of testing natively within Autify, but some of our clients have more advanced testing needs and want to go beyond Autify’s native capabilities; In those instances, clients can utilize JavaScript to greatly expand the scope of their testing. ## What is a JS Step? ***[JS Step]*** is a function that allows you to execute JavaScript within Autify’s ***[Scenario]***. This function enables capabilities that are unsupported by Autify’s standard functions. Given its powerful nature, we have provided a detailed explanation below. After the section on how to use this function, you will find **specific use cases in the latter part of this article**. We hope they are useful! JS step will fail when a page is reloaded This failure happens because the page reload destroys the current execution context, leading to the loss of the JS step execution context. ## How to Add a JS Step in Your Scenario 1. Go to the **Scenario Details** Page where you want to add the **JS Step** 2. Move the cursor in between the steps where you want to add the **JS Step** ![inset-js-step.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/inset-js-step%281%29.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 3. Click the **+** icon and and select **Insert Step**. Select **JS Step** from the menu that appears. ![Screen Shot 2022-07-21 at 18.22.07.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-07-21%20at%2018.22.07.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 4. Type your JavaScript code in the text editor. The code will already be wrapped in a function, so no need to include that syntax. ![Screen Shot 2022-06-13 at 5.56.28 PM.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-06-13%20at%205.56.28%20PM.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 5. You can optionally name your **JS Step**, as well as include a Memo, such as a description of what is happening on this particular step ![Screen Shot 2022-06-13 at 6.07.15 PM.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-06-13%20at%206.07.15%20PM.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 6. Click **Save** ## Use a value obtained or generated in a JS Step in other steps In ***[JS Step]***, you can obtain information from elements displayed on the page or generate values. `return` allows you to use this information in subsequent steps. The actual `return` value can be seen on the test result. ![return-value-en](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/return-value-en.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) If you have not `return` in JS step, this value will be `null`. ![not-return-en](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/not-return-en.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) Only **strings and numbers** can be used in subsequent steps. ### Used in the operation and assertion step 1. In the **Scenario Details Page**, click on the step you wish to insert the return value in 2. In the **Text to assign** dropdown, select **Other step's result** and select the desired **JS Step** whose data you wish to insert ![js-step-text-to-asign.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/js-step-text-to-asign.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) ### Use as Arguments of a JS Step Values returned by a JS step can be used as arguments for other JS steps. Details are explained in the section "Using Arguments in JS Step" below. ## Using Arguments in a JS Step 1. Click on the thumbnail of the **JS Step**, which you want to pass in an argument for. 2. Click on the **+** icon within the parenthesis of the function ![js-step-adding-arguments.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/js-step-adding-arguments.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 3. Enter the name of your argument and click **Add** ![js-step-arg-name.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/js-step-arg-name.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 4. In the **Argument Values**, select the type of value you'd like to pass in - **Given value** allows you to hardcode in a string - [Test email address](https://help.autify.com/docs/en/email-test) allows you to select a pre-created test email address - [Data](https://help.autify.com/docs/en/creating-data) allows you to select the columns of data in the scenario - **Other step's result** allows you to pass in the return value of a previous **JS Step** or [Dynamic Value](https://help.autify.com/docs/en/dynamic-value-generation) - [Variable](https://help.autify.com/docs/en/passing-variables-between-tests) allows you to select the key set in the **Import variables** ![en-js-argument-value.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/en-js-argument-value.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) JS Step arguments are defined as String Even if you assign a numerical value to an argument in the UI, it is defined as a String in the code. You need to explicitly convert it to a Number if you want to use it in calculations. For instance, you can declare it with `Number()`. 1. To delete or rename an argument that has already been added, click on the target argument and make the necessary edits ![rename-arg.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/rename-arg.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) ## JavaScript Snippets For your convenience, we have compiled dozens of the most commonly used JS code snippets when testing with Autify; You can find a link to our JS Snippets [here](https://autify-javascript-snippets.netlify.app/). ### How to use JavaScript Snippets 1. Add a JS step to the scenario 2. In the Autify JS Snippet database, select the snippet you wish to use ![Screen Shot 2022-06-21 at 5.39.07 PM.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-06-21%20at%205.39.07%20PM.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 3. Copy the JS snippet by hovering over it and clicking the "copy" icon on the top right corner of the snippet ![Screen Shot 2022-06-21 at 5.40.44 PM.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-06-21%20at%205.40.44%20PM.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) 4. Paste the snippet into your JS Step and make the necessary changes to the code to suit your test ![Screen Shot 2022-06-21 at 5.44.10 PM.png](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/Screen%20Shot%202022-06-21%20at%205.44.10%20PM.png?sv=2026-02-06&spr=https&st=2026-10-28T10%3A07%3A37Z&se=2026-10-28T11%3A07%3A37Z&sr=c&sp=r&sig=23KFdFdxPAOPEj5y%2F%2Ft530HxbEC%2FWn8AxfcP45rrVYs%3D) ## JS Steps Use Cases There are many different ways you can use JS Steps to test with Autify. Here are some example use cases: - API calls - Handling cookies - Custom assertions