You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/sources/k6-studio/record-your-first-script.md
+87-57Lines changed: 87 additions & 57 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -10,10 +10,10 @@ This tutorial shows how to create a recording, set up custom rules, and generate
10
10
11
11
In this tutorial, you will:
12
12
13
-
- Create a test recording using the https://test-api.k6.io/ service.
13
+
- Create a test recording using the https://quickpizza.grafana.com/ service.
14
14
- Learn how to create groups to organize your test recordings.
15
15
- View the request and response data from a test recording.
16
-
- Use the Generator to create a correlation and a custom code rule.
16
+
- Use the Generator to create a correlation, parameterization, and a custom code rule.
17
17
- Validate your test script from the Generator.
18
18
- Export your test script.
19
19
@@ -27,7 +27,7 @@ To complete this tutorial, you'll need to:
27
27
28
28
{{< admonition type="note" >}}
29
29
30
-
This tutorial uses the `test-api.k6.io` service, which is a public shared environment. You can use it and follow along this tutorial, or you can use a service that you own. The `test-api.k6.io` service is also [open source](https://github.com/grafana/test-api.k6.io) if you’d like to deploy a private instance.
30
+
This tutorial uses the `quickpizza.grafana.com` service, which is a public shared environment. You can use it and follow along this tutorial, or you can use a service that you own. The `quickpizza.grafana.com` service is also [open source](https://github.com/grafana/quickpizza) if you'd like to deploy a private instance.
31
31
32
32
{{< /admonition >}}
33
33
@@ -37,44 +37,54 @@ To create a test recording:
37
37
38
38
1. Open the k6 Studio desktop application.
39
39
1. Click **Record Flow**.
40
-
1. Type "test-api.k6.io" under **Starting URL**.
40
+
1. Type "quickpizza.grafana.com" under **Starting URL**.
41
41
1. Click **Start recording**. You should see a Google Chrome window open after a few seconds, and the **Requests** header in the k6 Studio application.
1. In k6 Studio, click the edit button next to **Default group**, rename it to "Homepage", and press **Enter**.
46
-
1. Next click **Create group**, name it “Go to Create Crocs”, and press **Enter**. Groups can help organize your test scripts so they're easier to edit and maintain in the future, and give you timing metrics for each group in your test script.
47
-
1. In the browser window, under **Private APIs**, click on **/my/crocodiles** next to the **POST** method. You should see an authentication dialog box in the next screen.
48
-
1.For username, enter "studio-user". For password, enter "password".
46
+
1. Next click **Create group**, name it "Generate pizza", and press **Enter**. Groups can help organize your test scripts so they're easier to edit and maintain in the future, and give you timing metrics for each group in your test script.
47
+
1. In the browser window, press the **Pizza, Please!** button. You should see a generated recommendation.
48
+
1.Under the recommendation, press the **Love it!** button. A message saying, "Please log in first." will appear.
49
49
50
-
You'll be logged in to the test service, and this will complete the requests for the "Go to Create Crocs" group.
50
+
This will complete the requests for the "Generate pizza" group.
In this next step, you'll use the form for the test service to create a crocodile.
56
+
In this next step, you'll log in to the service to be able to rate a pizza:
57
57
58
-
To create a crocodile:
58
+
1. In the k6 Studio application, click **Create group**, name it "Log in", and press **Enter**.
59
+
1. In the browser, in the top-right of the screen press the **Login/Profile** link. You should see an authentication dialog box.
60
+
1. For username, enter "studio-user". For password, enter "k6studiorocks".
59
61
60
-
1. In k6 Studio, click **Create group**, name it "Create Croc", and press **Enter**.
61
-
1. In the browser window, you should have successfully authenticated in the previous step and be able to see the **My Crocodiles** page. Fill out the **Name**, **Sex**, and **Date of birth** fields of the HTML form section.
62
+
You'll be logged in to the test service, and this will complete the requests for the "Log in" group.
In this next step, you'll generate and rate a pizza again, this time with a custom name.
69
+
70
+
1. In k6 Studio, click **Create group**, name it "Generate and rate custom pizza", and press **Enter**.
71
+
1. In the browser, press the **Back to main page** link. You should see the homepage again.
72
+
1. In the top-right of the page, toggle the `Advanced` input, a form will appear on the page to customize the generated pizza.
73
+
1. In the form, insert "testedpizza" as a name in the **Custom Pizza Name** input, and press the **Pizza, Please!** button. You should see a generated recommendation with the same name.
The Request and Response panels have tabs where you can view the headers, payload, or cookies for a request, and the headers, content, and cookies for a response. For the response content tab, you can also view it in different formats, such as the raw data, or a preview.
89
99
@@ -94,47 +104,84 @@ To generate a script from a test recording:
94
104
- If you still have the test recording open from the last step, click **Create test generator** on the top-right.
95
105
- You can also click **+** next to Generator on the left side, and then select your recording on the top-right.
96
106
97
-
A dialog box shows up that lets you select the hosts to use from the recording for generating the script. Select `test-api.k6.io` and press **Continue**.
107
+
A dialog box shows up that lets you select the hosts to use from the recording for generating the script. Select `quickpizza.grafana.com` and press **Continue**.
The Generator lets you generate and modify a k6 test script via the user interface, without having to write JavaScript code.
102
112
103
113
On the top, you can inspect the recording from this view, similar to the Recorder. On the bottom, you can see the list of **Test rules**, with a **Verification rule** already added.
**Test rules** are objects that you can add to your generator file to modify the script generated from the recording. The **Verification rule** that's created by default modifies the script to add [Checks](https://grafana.com/docs/k6/latest/using-k6/checks/). These checks verify that when you run your script, the status codes you receive from responses are the same as the one you previously recorded. That's a nice safety measure for your system that you get by default.
117
+
**Test rules** are objects that you can add to your generator file to modify the script generated from the recording. The **Verification rule** that's created by default modifies the script to add [Checks](https://grafana.com/docs/k6/latest/using-k6/checks/). These checks verify that when you run your script, the status codes you receive from responses are the same as the one you previously recorded. That can be a good starting point to verify your application is working as expected.
108
118
109
119
You can also inspect the script that would be generated by selecting the **Script** tab in the top panel.
110
120
121
+
## Validate a test script
122
+
123
+
In this next step, you can validate the test script that was created from the recording to check if your script is working correctly. To validate a test script:
124
+
125
+
1. In k6 Studio, click on the **Script** tab next to **Requests**.
The Validator runs your script in a single iteration and lets you inspect the requests and responses sent, and see any logs and checks from k6.
131
+
132
+
For this tutorial, running the script that was created by the previous steps will result in a couple of requests that should be returning a 200 status code, returning a 401 status code instead.
1. The log in endpoints use a CSRF token to validate the request.
139
+
2. The pizza rating endpoint uses a `pizza.id` property to rate the pizza that was randomly generated.
140
+
141
+
For both cases, these are common scenarios where APIs or services require information to be retrieved from an endpoint, and then used in subsequent requests.
142
+
143
+
In the next steps, you'll learn how to use rules to customize your script and make it work correctly.
144
+
111
145
## Correlate dynamic data
112
146
113
-
If you inspect the data of the **POST** request, you can see that it makes use of a `csrf` token.
147
+
If you inspect the data of the **POST** request`/api/csrf-token`, you can see that it generates a `csrf` token.
This is a token that was generated from a previous request and that was present in the form for security reasons. That's an example of a dynamic value that you can't predict when generating the script because that value is generated by the server when you reach the form, and the server expects it back when you submit the form.
151
+
That's an example of a dynamic value that you can't predict when generating the script because that value is generated by the server when you reach the log in form, and the server expects it back when you submit the form.
118
152
119
-
You'll need a way to generate the script so that it knows to get this value at runtime and replace the value from the recording from this extraction. You can do that by using the **Correlation Rule**.
153
+
You'll need a way to customize the script so that it knows to get this value at runtime and replace the value from the recording from this extraction. You can do that by using the **Correlation Rule**.
120
154
121
155
To add a correlation rule:
122
156
123
157
1. In k6 Studio, click **+ Add rule** and select **Correlation** from the entries.
124
-
1. Under **Extractor**, in the **Begin** field, type `csrfmiddlewaretoken" value="`.
125
-
1. In the **End** field, type `"`.
158
+
1. Under **Extractor**, set the **Target** field to **Headers**.
On the request list, you'll see that a `match` label appears next to a couple of requests. These are the requests that this particular rule is either extracting or replacing a value from.
164
+
On the request list, you'll see that a `Value extracted` and `match` label appears next to a couple of requests. These are the requests that this particular rule is either extracting or replacing a value from.
130
165
At the bottom of the rule editor, you can see the value that got extracted.
k6 Studio updates the labels in real-time as you edit your rule. It's useful to see when you actually have a match and where you are actually replacing values. When replacing the value, by default the rule will try to find occurrences of that value and automatically replace those. If you need more control over it you can open the toggle to customize the replacer selector.
135
168
136
169
With this rule in place, you have added dynamic data correlation to your script without having to touch any code.
137
170
171
+
If you run the validation step again, you can see that one of the failing requests returns a 201 status code.
172
+
173
+
There's still one failing request related to the generated ID for the pizza not being extracted and used in the next request. To fix that:
174
+
175
+
1. In k6 Studio, click **+ Add rule** and select **Correlation** from the entries.
176
+
1. Under **Extractor**, set the **Target** field to **Body**, set the **Type** field to **JSON**.
This correlates the generated pizza ID in both the `Generate pizza` and `Generate and rate custom pizza` groups.
182
+
183
+
You can validate the test script again, and all the requests should be returning the correct status code, and the k6 checks should be passing.
184
+
138
185
## Parameterize a value
139
186
140
187
You can make use of the [parameterization rule](https://grafana.com/docs/k6-studio/components/test-generator/#parameterization-rule) to modify a value from some text, and replace it with a variable or even data from a CSV or JSON file.
@@ -143,10 +190,10 @@ To add a parameterization rule:
143
190
144
191
1. Under **Test rules**, click **+ Add rule** and select **Parameterization**.
145
192
1. Change the **Type** field to `Text`.
146
-
1. In the **Text** input, insert the name you used earlier when creating a crocodile.
147
-
1. On the right-side, insert the new value you want to replace with under **Value**. For example `Grot`.
193
+
1. In the **Text** input, insert the name you used earlier when generating the custom pizza.
194
+
1. On the right-side, insert the new value you want to replace with under **Value**. For example `Grotpizza`.
You'll see that the **POST** request from the recording now has the `match` label next to it. If you inspect the **Payload** you can see that it's now using the newly defined name.
152
199
@@ -157,27 +204,10 @@ You can make use of the **Custom Code** rule to insert a custom JavaScript snipp
157
204
1. In k6 Studio, click **+ Add rule** and select **Custom Code** from the entries.
158
205
1. In the **Snippet** input, type `console.log('hello k6')`.
0 commit comments