Charles tutorial (2)

Let you learn knowledge clearly, there are codes, there are explanations, copy of the walk, learn will!Copy the code

I use [MDnice] typesetting, resulting in the content is too large to put down at one time, can only be serialized

The section

• 1-4 Familiar with basic environment
• 5-7 Troubleshooting scenarios
• 8-9 breakpoint explanation
• 10-13 Detailed explanation of data agent, QA answers

5. Clear records

6. Weak network environment

❝

In some cases, I just want to test the interface in a weak network environment, but our testers can’t go to the corner or under the bridge to test our application, which is silly, hahaha!!

Tell me about a real situation

Scenario 1: There is an upload, the requirement is: loading is in process, loading is displayed, the upload is successful, and the interface is switched;

Now the interface responds too fast, so I switch to the interface with successful uploading soon. I am not sure whether my loading is effective, and whether loading is shut down correctly. If the interface reports an error, whether loading is shut down as expected

You are so confident that my code will never have any bugs. Suddenly, I found that the background interface reported an error and loading was not disabled. One of my classmates told me a bug.

To enter the body

Common test methods

1. Write the request interface to a delay timer and request it after a few seconds – bad, too much code
2. Write delayers at the interface response and return results from the wrapped FETCH method after a few seconds – bad, too much code
3. Write wrong interface address deliberately, test error,loading is disabled — no, there is too much code
4. Chrome’s own weak web Settings on – yes
5. Charles turn on the weaknet — yes

Now show you what happens when Chales turns on the weak net

Weak network Settings can be enabled in either of the above two ways. If it is enabled, we need to set the network speed

Just a couple of things here

• Enable Throttling enables the weak network
• Only for Selected hosts indicates that if this option is Selected, the weak network is Only valid for the list below, and other hosts that are not in the list are normal network speed
• Throttle preset means network speed such as 3G, 4G, etc
• Download network downlink speed – simply interpreted as Download network speed
• Upload uplink speed – The speed at which a file is uploaded

External – Uplink bandwidth and downlink bandwidth

We can choose our bandwidth (3G, 4G) from the list if not, just Add a Preset button (Add Preset button)

Then refresh the page to see the response effect, response time

When the weak network environment is opened, the response time of the page of the speaker directly changes to 56.67s, indicating that the effect is successful

Now take a look at Chrome’s weaknet Settings

There are a couple of options

• Online there is no limit
• Fast 3G
• Slow 3G
• Offline Offline

Also, if you don’t have a desired speed limit, you can add custom speed Settings

The above describes how to set up and test the performance of applications in weak network environment. One thing to note is that if your network environment is not good, that is, your mobile phone or computer connection and other network speed itself is slow, even if the Chrome or Charles set to 5G network speed, it is useless. Congenital limitation

Scenario 2: There is another scenario that is more common

App or Web homepage, if the “skeleton screen” effect is enabled, weak network test is also feasible, you can test whether our layout is ok

Scenario 3: Test whether the interface timed out is fault-tolerant. In the payment scenario, such fault-tolerant/remedial measures are necessary

7. Charles found that there was no data when he visited any webpage, so he was directly disconnected from the Internet and QQ was offline

Don’t panic. There must be some magic that’s been turned on, causing this phenomenon, okay

If you notice that everything is fine with Charles, please check the following

Maybe you hit a shortcut key by accident, and you check it, and it says only requests from the list are allowed in, and everything else is denied; See, it blocks not only the Web, but also desktop reference requests