We usually say that H5 test HTML5
In fact: the mobile terminal WEB page.
★ our previous APP is to use native system kernel, equivalent to operate directly on the system, is software on our traditional sense, more stable
★ H5 of APP served browser kernel system call, equivalent to operate in a web page, somewhat less stability than the native APP, it seems to have one million subscribers of H5 APP
★ biggest advantage H5 is a cross-platform development easy, APP, then need to use the language of ANDROID and IOS written language of their own, as long as the development of a H5
★ Simply put: H5 is based on the web, native client-based
First, how to determine whether a page is H5 APP page
1, no network
disconnect from the network, or display the error page 404 is H5
2, Page Layout
. A turn in the phone settings, display layout options developers boundary function;
b into the app to view the layout of the border;.
. C native application can see the layout of each border controls, H5 only one boundary whole page
(Note: The developer tools are entered <About phone> find <version>, some phones this version is more information in, double click <version>, will be prompted to turn on developer mode, then return to common menu open developer options)
Primeval: H5:
3. Press page
Press page, there are special mark, magnifying glass, copy, paste, etc., and even shake the phone (Android), it indicates that H5
4, load a way
to open a new page below the navigation bar, then a load line, this page is the page H5
micro letter inside to open our common H5 page has a green load lines.
5, if the navigation bar will be closed operative
APP appeared among the top navigation bar or have a close button to close the icon, then the current page is H5
6, web provider
Scroll down when the display URL is the provider of H5 page
Two, H5 test which aspects should be considered
1 , business logic related
In addition to basic functional testing, test H5 page, we need to focus on the following:
1.1 landing
Currently each client H5 and native interoperability have done, so everyone in the test to note two points:
A, if the client is logged in, enter the H5 is still logged on.
B, if the client is not logged into H5, click on the corresponding button OR link.
If you need to log in, pull up the native must log in;
If canceled logged in, log in again if can pull up, or whether to stay in the pages has a corresponding login prompt.
1.2 page
Flip the page loads encountered, it is necessary to note the contents of the case one or multiple pages.
A, when page data is loaded, on follow-up data is correct page request.
ps: this should be noted in the fast operating scenarios, the request is not the number of pages in ascending order, fast operation
Whether to issue a request to the corresponding time (as yet loading the first page out time continued pull-up operation).
1.3 refresh and return
A, is still in the drop-down refresh the current page
B, the user clicks the refresh button is still active in the current page
C, click on the back button to return to the fallback page whether it is desired page
1.4 of the requested data and returns:
A: submission of the data, the data is correctly sorted into the background management system: a wedding invitation to attend the wedding of the user, as well as the number of participants and number information, whether to submit the background right.
B: send a request to return the correct data you requested: such as our common wedding invitation, whether there is acknowledgment of receipt?
2 , H5 adaptation related
H5 adaptation is actually more than the client relatively speaking, less some little difference between the mobile phone brand, so do not be too concerned about, the most prone to the problem is android2.3 system, pay special attention to this:
A, large-screen (such as 720 * 1280, focusing on whether the page is completely softened background page, refresh with jitter), a small-screen phone (such as 320 * 480, focus on the next bomb wrapped box style and copy)
B, android2.3, android4.X random to find a
C、ios5、ios6、ios7
D, the browser can also be a perfect display
3 , safety-related
3.1 clear what are your distribution?
As the only passenger, subject and object, wap, whether or not delivery channels have been restricted, whether directly through the url request interception
3.2 the need for access to real-name authentication Alipay related to money-related.
Such as Lynx points, envelopes, etc., in order to prevent the brush, it is generally required to determine whether the real-name authentication Alipay.
In my previous company, once launched in order to promote their activities - a number of money, every time a dime a gross number, the time is 15 seconds, appears below bug:
1) use a script to count the money, 15 out of more than 100 the number of seconds ~~ - last for the promotion of cost considerations, put a time limit of five seconds,
2) forwards once to reward one more chance to count the money, the results did not do a good job restrictions, promotion of friends of friends, or can reward number.
4 , relevant experience
4.1 resource-related
A, pages with pictures, then there Taobao recommend the picture generally not more than 50kb, in line with a principle, try to decrease the picture.
B, whether the resource compression, is loaded by CDN. What --- CDN that? --- nearby area access, faster service.
C, how to ensure the effective update after the second release.
D, similar problems for the company name, offer name length, the best screen adaptation based on the size rather than the truncated on the phone, because there will be no tips can be seen on the phone.
Truncation cause large-screen display only words, interact well
4.2 Flow
A, does not change the picture for some, such as game animation picture, every time something does not need to request, do local cache.
B, whether to do a page to load when more data.
4.3 page show time
A, focus on first page load time screen.
4.4 page Tips
The A, weak network, data loading is slow, if there is a corresponding loading tips.
B, when the interface to obtain an abnormality, it is friendly.
C, page upon page refresh or load new content if there is jitter.
4.5 mobile operating-related
A, after the lock screen display page.
B, then fall back to the background, in the foreground show exhaled again.
C, slide your finger is smooth, finger clicks focus correctly positioned, different models will be different. After clicking the focal position is sensitive.
4.6 weak network experience
5 , the data check Buried
Buried confirmed case with the front end. What point is buried?
Then you may want to ask, what tools H5 test is? Very simple.
1: your hand phone → two-dimensional code scanning directly open the link, to test
2: Google into the mobile phone browser → debug mode for testing
Download the Google browser, click your browser's upper right corner of the "three" icon, select the drop-down menu → "More Tools" → "Developer Tools", or just press F2;