%PDF-1.4 %âãÏÓ 1 0 obj << /Type /Catalog /Pages 2 0 R >> endobj 2 0 obj << /Type /Pages /Count 3 /Kids [5 0 R 7 0 R 9 0 R] >> endobj 3 0 obj << /Type /Font /Subtype /Type1 /BaseFont /Helvetica >> endobj 4 0 obj << /Type /Font /Subtype /Type1 /BaseFont /Helvetica-Bold >> endobj 5 0 obj << /Type /Page /Parent 2 0 R /MediaBox [0 0 595.28 841.89] /Resources << /Font << /F1 3 0 R /F2 4 0 R >> >> /Contents 6 0 R >> endobj 6 0 obj << /Length 5859 >> stream BT /F2 22 Tf 0.06 0.08 0.12 rg 1 0 0 1 46 789.89 Tm (How To Test A Function JavaScript Developer) Tj ET BT /F2 22 Tf 0.06 0.08 0.12 rg 1 0 0 1 46 762.89 Tm (Tools) Tj ET BT /F2 11 Tf 0.72 0.14 0.18 rg 1 0 0 1 46 725.89 Tm (TechRounder PDF Edition) Tj ET BT /F1 9.5 Tf 0.36 0.39 0.46 rg 1 0 0 1 46 709.89 Tm (Live article: https://www.techrounder.com/javascript/how-to-test-a-function-javascript-developer-tools/) Tj ET q 0.82 0.85 0.9 RG 1 w 46 691.39 m 549.28 691.39 l S Q BT /F1 10 Tf 0.24 0.27 0.32 rg 1 0 0 1 46 679.39 Tm (By Vipin PG | Published January 16, 2021 | Updated January 4, 2026 | Format: Guide | 5 min read) Tj ET BT /F2 13 Tf 0.72 0.14 0.18 rg 1 0 0 1 46 656.39 Tm (Quick answer) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 636.39 Tm (Welcome again to the world of development! I think no wonder to anyone that function testing in the) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 621.39 Tm (JavaScript development process exists for the ease of checking large projects for bugs.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 596.39 Tm (Welcome again to the world of development! I think no wonder to anyone that function testing in the) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 581.39 Tm (JavaScript development process exists for the ease of checking large projects for bugs. Sometimes it) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 566.39 Tm (happens that after refactoring a component in one place it began to work better, but in another, it just) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 551.39 Tm (fell off.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 529.39 Tm (Tests will show this without manually clicking all the logic after each code change. Tests simulate user) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 514.39 Tm (actions automatically, and they also allow you to write high-quality code. In this article which is called) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 499.39 Tm ('How To Test A Function JavaScript Developer Tools' you will read a lot about the functions in) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 484.39 Tm (JavaScript and how you can test the function quickly and easily. Let's start from the beginning.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 462.39 Tm (A JavaScript function is a piece of code that can be described once, and then called for execution in) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 447.39 Tm (different parts of the program any number of times. This is the classic purpose of a function. In this) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 432.39 Tm (scenario, we put the code, which we repeat several times on the page, into a function, and then use it in) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 417.39 Tm (those places in the program where we need to execute it. Another traditional use of functions is when) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 402.39 Tm (we use them as the main building blocks of an application.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 380.39 Tm (In this case, the task is divided into subtasks, and then we solve each of them by creating separate) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 365.39 Tm (functions. After that, we usually move on to developing the central code using all the previously) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 350.39 Tm (developed functions in it. As a result, such a program becomes more structured. It is easier to make) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 335.39 Tm (various changes and add new features to it. There are several ways to create a function in) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 320.39 Tm (JavaScript. These are: Function Declaration; Function Expression; Arrow Function. Function) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 305.39 Tm (operations in JavaScript can be divided into 2 steps:) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 283.39 Tm (- Function declaration \(creation\). Writing a function using a Function Declaration begins by writing the) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 269.59 Tm (function keyword. After that, the name of the function is indicated, in which parentheses are listed, if) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 255.79 Tm (necessary, separated by commas, and the function code enclosed in curly braces. A function can have as) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 241.99 Tm (many parameters as you like or not at all. Parentheses are indicated in any case. If there are several) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 228.19 Tm (parameters, then they must be separated by a comma. They allow you to more conveniently \(by name\) get) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 214.39 Tm (the passed arguments to a function when it is called. A function code \(also called a function body\) is a set of) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 200.59 Tm (instructions enclosed in curly braces that must be executed when it is called.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 183.79 Tm (- Calling \(executing\) this function. The declared function is not executed by itself. In order for a function to) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 169.99 Tm (run, it must be called. The function is called by specifying its name and two parentheses. Inside the) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 156.19 Tm (brackets, if necessary, you can pass arguments \(additional data\) to it, separating them from each other) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 142.39 Tm (using a comma.) Tj ET q 0.86 0.88 0.92 RG 1 w 46 42 m 549.28 42 l S Q BT /F1 8.4 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 30 Tm (TechRounder | Page 1 of 3) Tj ET BT /F1 7.2 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 19 Tm (https://www.techrounder.com/pdf/blog/how-to-test-a-function-javascript-developer-tools.pdf) Tj ET endstream endobj 7 0 obj << /Type /Page /Parent 2 0 R /MediaBox [0 0 595.28 841.89] /Resources << /Font << /F1 3 0 R /F2 4 0 R >> >> /Contents 8 0 R >> endobj 8 0 obj << /Length 6814 >> stream BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 789.89 Tm (After writing the JavaScript code \(function\), the responsible developer wants to check its) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 774.89 Tm (serviceability and operability. Let's move on to the main question of this article - How to check the) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 759.89 Tm (debugged function - quickly, simply, clearly, and intelligibly? Now we will take a look at such a) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 744.89 Tm (wonderful testing framework as Jest. As stated on the homepage of this technology: Jest is a) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 729.89 Tm (delightful JavaScript testing framework with a focus on simplicity.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 707.89 Tm (And it's true, Jest is very simple. It does not require additional settings, is easy to understand and use,) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 692.89 Tm (and also has pretty good documentation. Great for projects which are using Node, React, Angular, Vue,) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 677.89 Tm (Babel, TypeScript, and more. It also has an open-source code and is maintained by Facebook. The initial) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 662.89 Tm (stage of working with Jest is installation. To install Jest into your project, run:) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 640.89 Tm (npm install -save-dev jest. After installation, you can update the scripts section of your package.json:) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 625.89 Tm (`"scripts" : { "test" : "jest" }`) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 603.89 Tm (With such a simple call, you can already run your tests \(in fact, Jest will require at least one test to) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 588.89 Tm (exist\). By calling the 'jest -init' command at the root of the project and answering a few questions, you) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 573.89 Tm (will get the jest.config.js configuration file. Or you can add the configuration directly to your) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 558.89 Tm (package.json. To do this, add the "jest" key to the JSON root, and in the corresponding object, you can) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 543.89 Tm (add the settings you need.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 521.89 Tm (We'll discuss the options themselves later. At this stage, this is not necessary, since jest can be used) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 506.89 Tm ("outright", without additional configurations. The test function is used to create a new test. It takes) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 491.89 Tm (three arguments. The first one is a line with the name of the test, which Jest will display in the report.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 476.89 Tm (The second is a function that contains the logic of your test. You can also use the 3rd argument -) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 461.89 Tm (timeout.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 439.89 Tm (It is optional and the default is 5 seconds. It is set in milliseconds. This parameter is required when you) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 424.89 Tm (are working with asynchronous code and returning a promise from the test function. It specifies how) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 409.89 Tm (long Jest should wait for the promise to resolve. After this time, if the promise was not resolved, Jest) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 394.89 Tm (will consider the test to be failed. You can also use it\(\) instead of test\(\). There is no difference between) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 379.89 Tm (such calls: it\(\) is just an alias for the test\(\) function.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 357.89 Tm (Let's look at the main testing methods and why they are needed, which Jest provides us with:) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 335.89 Tm (- toBe\(\) - suitable if we need to compare primitive values or whether the passed value is a reference to the) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 322.09 Tm (same object that is specified as the expected value. Values are compared using Object.is\(\). In contrast to ===,) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 308.29 Tm (this makes it possible to distinguish 0 from -0, check if NaN is equal to NaN.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 291.49 Tm (- toEqual\(\) - suitable if we need to compare the structure of more complex types. It will compare all fields) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 277.69 Tm (of the passed object with the expected one. It will validate every element of the array and do it recursively) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 263.89 Tm (throughout the nesting.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 247.09 Tm (- toContain\(\) - check if the array or iterable contains the value. The === operator is used for comparison.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 230.29 Tm (- toContainEqual\(\) - it checks or contains an array element with the expected structure.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 213.49 Tm (- toHaveLength\(\) - it checks whether the object's length property is as expected.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 196.69 Tm (- toBeNull\(\) - it checks for equality with null.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 179.89 Tm (- toBeUndefined\(\) - it checks for equality with undefined.) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 163.09 Tm (- toBeCloseTo\(\) - such a method is convenient for floating-point numbers when you don't care about) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 149.29 Tm (precision and don't want the test to depend on a slight difference in fraction. The second argument can be) Tj ET BT /F1 10.5 Tf 0.2 0.23 0.28 rg 1 0 0 1 46 135.49 Tm (passed to what decimal place the precision is required for the comparison.) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 118.69 Tm (These were some of the basic techniques when working with Jest, which helps to test the JavaScript) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 103.69 Tm (function. But there are many more of them, and I am sure that you will easily get to know them during) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 88.69 Tm (the development and testing of the function.) Tj ET q 0.86 0.88 0.92 RG 1 w 46 42 m 549.28 42 l S Q BT /F1 8.4 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 30 Tm (TechRounder | Page 2 of 3) Tj ET BT /F1 7.2 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 19 Tm (https://www.techrounder.com/pdf/blog/how-to-test-a-function-javascript-developer-tools.pdf) Tj ET endstream endobj 9 0 obj << /Type /Page /Parent 2 0 R /MediaBox [0 0 595.28 841.89] /Resources << /Font << /F1 3 0 R /F2 4 0 R >> >> /Contents 10 0 R >> endobj 10 0 obj << /Length 1704 >> stream BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 789.89 Tm (Many of the newbies forget how to check for the existence of a function in JavaScript, so I leave here) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 774.89 Tm (a little prompt on how to do it:) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 752.89 Tm (`if \(typeof functionName == 'function'\) { console.log \('Yes! Function exists!'\); } else { console.log \('Alas,) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 737.89 Tm (the function is missing'\); }`) Tj ET BT /F2 13 Tf 0.08 0.1 0.14 rg 1 0 0 1 46 709.89 Tm (Conclusion) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 687.89 Tm (In the article 'How To Test A Function JavaScript Developer Tools'. Above, I have described some) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 672.89 Tm (simple tests using Jest's validation functions. I hope you will use the received information with benefit) Tj ET BT /F1 11 Tf 0.14 0.16 0.2 rg 1 0 0 1 46 657.89 Tm (and save your time during the development process. Good luck in testing JavaScript functions!) Tj ET BT /F2 13 Tf 0.08 0.1 0.14 rg 1 0 0 1 46 629.89 Tm (References) Tj ET BT /F1 10 Tf 0.18 0.2 0.24 rg 1 0 0 1 46 609.89 Tm (1. tutorialspoint.com - What-are-different-ways-of-defining-functions-in-JavaScript -) Tj ET BT /F1 10 Tf 0.18 0.2 0.24 rg 1 0 0 1 46 596.39 Tm (https://www.tutorialspoint.com/What-are-different-ways-of-defining-functions-in-JavaScript) Tj ET q 0.86 0.88 0.92 RG 1 w 46 42 m 549.28 42 l S Q BT /F1 8.4 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 30 Tm (TechRounder | Page 3 of 3) Tj ET BT /F1 7.2 Tf 0.42 0.45 0.5 rg 1 0 0 1 46 19 Tm (https://www.techrounder.com/pdf/blog/how-to-test-a-function-javascript-developer-tools.pdf) Tj ET endstream endobj xref 0 11 0000000000 65535 f 0000000015 00000 n 0000000064 00000 n 0000000133 00000 n 0000000203 00000 n 0000000278 00000 n 0000000420 00000 n 0000006330 00000 n 0000006472 00000 n 0000013337 00000 n 0000013480 00000 n trailer << /Size 11 /Root 1 0 R >> startxref 15236 %%EOF