Now the extension will capture click, input the document level scroll events. If you want to change the size, please input the window size again and open a new window)Ĭlick Record events to start the events recording Input the url, window type and window size : Browse a test cast JSON file and upload the fileĬhrome Recorder now can only record clicks, inputs and document level scroll events Replay the flow now to see the changes.Record the user interactions, take screenshots and replay the actions.operator: = (click add operator button).In Assert Element, edit the new step with the following details:.In the Mocha step menu, select Add step before.Say you want to wait until the 9 coffees display on the page before performing any steps.For example, the Scroll event after the Mocha step is not necessary.Click on the 3-dot kebab menu next to the step to open the menu. Instead of re-recording the user flow, you can just edit it. This is useful if you want to add an extra step or remove an accidentally added step. There are options to add and remove steps too. Try to edit other step properties such as type, target, value and more. Replay the flow now, it should select Mocha instead of Cappuccino. For example, if you want to select Mocha instead of Cappuccino, you can:Įdit the selector value to aria/Mocha instead.Īlternatively, click the Select button and then click Mocha on the page. Hover over the selector #2 and click on - to remove it. For example, you can remove the selector #2 because just aria/Cappuccino is sufficient in this case. For example, if the Recorder successfully queries the element with the first selector, it will skip the second selector and proceed to the next step. When replaying the user flow, the Recorder tries to query the element with one of the selectors by sequence. For more information, see Understand the recording's selector. For example, expand the Click Element "Cappuccino" step. # Expand stepsĮxpand each step to see the details of the action. Let's walk through the basic options to edit the steps within the recorded workflow.įor a comprehensive list of editing options, see Edit steps in features reference. You can enable the Web Vitals checkbox in the Performance panel, to view the Web Vitals metrics, identify opportunities to improve your user browsing experience.
Recordit chrome how to#
Learn how to analyze your page's runtime performance with the Performance panel. With the Recorder panel, you can record the checkout flow once and measure it regularly.Ĭlicking on the Measure performance button will first trigger a replay of the user flow, then open the performance trace in the Performance panel. For example, checkout is a critical user flow of a shopping website. You can measure the performance of a user flow by clicking on the Measure performance button. Share with us the replay settings you would like to have! # Measure a user flow More settings might be supported in the future. For example, expand the Replay settings, select Slow 3G in the Network drop-down. You can simulate a slow network connection by configuring the Replay settings. When replaying a user flow recording, the Recorder waits until the element is visible or clickable in the viewport or tries to automatically scroll the element into the viewport before replaying the corresponding step. The replay progress is shown in the Recorder panel as well. You can see the user flow replay on the page. Click End recording button to end the recording.Īfter recording a user flow, you can replay it by clicking on the Replay button. checkbox.Ĭlick on the Submit button to complete the checkout process. In the payment details form, fill in the Name and Email textboxes, and check the I would like to receive order updates and promotional messages. Notice that the Recorder shows the steps that you have performed so far.Ĭlick on the Total: $19.00 button to start the checkout process. indicating the recording is in progress.Ĭlick on Cappuccino to add it to the cart.Ĭlick on Americano to add it to the cart. For more information, see Customize the recording's selector.Ĭlick on the Start a new recording button. The Selector attribute textbox is optional. Click on the Start new recording button to begin.Įnter "coffee checkout" in the Recording name textbox.
In the next sections, we will walk you through how to record, replay and audit the following checkout flow with the Recorder panel: Checkout is a common user flow among shopping websites. We will be using this coffee ordering demo page. # Open the Recorder panelĬlick on More options > More tools > Recorder.Īlternatively, use the Command Menu to open the Recorder panel.
Our team is actively working on this feature and we are looking for your feedback for further enhancements.įor more information on how to share the recorded user flows, edit them and their steps, see the Recorder features reference.
0 kommentar(er)
