
Добавить юзера c обычной подпиской

Стань тестировщиком сегодня
Level 10 Practical aspects of testing WEB applications


Web Testing Applications and Plugins
Preparation for testing. Before you can begin testing, you need, like any professional in their field, certain tools. Just as a builder comes to a construction site with his tools, so does a tester approach testing. Install all these programs and plugins for yourself in order to arm yourself before big WEB testing. Next I will tell you how to use it.
Install the program and try to figure it out. This program is similar to network in the Chrome inspector but has a lot more features. For example, enable internet speed limit.
Displays web page load time
-
Fire Bug for Firefox
Because the standard FF inspector is very limited, testers use the inspector application - FireBug. The principle is the same as the web inspector.
Super program will check all site links for you
-
MeasureIT for FF
Useful addon, unfortunately only for Firefox. Allows you to accurately measure the size of the component in pixels. Needed to verify compliance with real sizes and mocap
Other small, useful for the tester applications in this list.
How to use the web inspector
Web Application Testing
A few points about testing Web applications:
When testing Web applications, you need to test:
-
Standard functionality
-
Configuration and Compatibility
-
Cross browser functionality support
-
Run all other types of tests
Testing Web applications is complicated by the presence of distributed system components that interact with the application (client, server, network)
Errors (or symptoms of alleged errors) can be corrected by correcting the code or by reconfiguring the system (client, server or network)
Web Standards Checklist

Hello my friend. As you know, the professional experience can be achieved only through excellent practice. Today, we will do just that. The whole level is devoted to the practice of WEB testing. It will be fun! To begin with, here are two sites that we will test:
http://gorod.dp.ua/ website from the network
http://www.qaacademy.net/ and our website

You will again run into a checklist of Web standards
To complete this task, copy this table to your google disk.
Then go through the checklist for the two sites, having completed all the tests according to the level guide. You can send the task at the end of the level.

1. Code quality
Are (X) HTML code and CSS tables of site pages valid?
-
The browser will display valid code faster and better than invalid code
-
Errors in the HTML code and CSS page will lead to a distorted display of the document on the screen
See http://validator.w3.org/ (page validation)
2. Is the page code well structured?
-
Semantically correct markup implies the use of html elements for their intended purpose
-
A well-structured HTML document is well accepted by browsers without support for style sheets, text browsers, handhelds, search engines, etc.
See https://seositecheckup.com/ (check page structure)
3. Are there any broken links on the site?
-
Broken links disappoint users and potentially turn your customers away from your site
-
Broken Links May Also Affect Search Engines Indexing Your Site
It is advisable to double-check the broken links manually to make sure that this is not protection against robots, or authorization is required to follow the link.
see http://validator.w3.org/checklink (link check)
4. How is a site with page loading speed?
-
“Don't make me wait ...” That's what users mean when they do all the research. Even broadband users get tired of slow downloads. According to statistics, users begin to leave the page after 5 seconds of waiting
You need to install the application for Chrome / FF - page speed monitor and measure the boot time with it
5. Does the browser throw any JavaScript errors when working with the page?
-
Any browser allows you to enable a debugger that will output errors to the console whenever a page crashes or exceptions in JavaScript. Open the web inspector, go to the console tab (console), surf the site and check for errors. Often, web bugs will throw console errors, the programmer can use them or you can understand the cause of the bug. A console error is always logged in a bug report.


Got what I mean? Not difficult? Then we can move on. Great job, tester!
6. Availability of hidden pages for users.
Your task is to check the availability of secure site pages
а) For registered user
б) For a user without registration
в) Clear cookies and check for lack of access
7. Is the "alt" attribute used in all significant images?
-
Each non-text element must be accompanied by a text description. You can see the signature of the image by hovering over it with the mouse. It is enough to check up to 5 images.
See http://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-text-equivalent
8. Does the site use relative units of measure for a font instead of fixed units?
-
CSS code and style sheets should use relative rather than absolute units to indicate element sizes. You can read about fixed and relative values in fonts in this article
See http://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-relative-units
http://www.webmascon.com/topics/coding/47a.asp
9. Does the page layout change in any way when zoomed in?
-
The layout of the Web site in any browser with any increase in font size should remain unchanged
-
When zooming in / out, all components must change proportionally, all links are left behind, and the buttons are active
10.Are the colors on the pages of the site contrasting and bright enough?
-
The difference between the background color and the text color should be contrast enough so as not to cause difficulties when reading
-
You cannot use colors that are too close to each other on the color wheel (optimally, the distance ¼ of the circle)
-
When viewing the site, blood should not go from the eyes, or at least the color scheme should not cause psychological discomfort
11. Is only color used to highlight critical information?
-
All important information highlighted in color should also be highlighted when there is no color, for example, using context or logical markup elements.
(Obsolete test, perform at your discretion)
Device Availability
12. Does the site work well in both modern and old browsers?
Decide which browsers you intend to support and to what extent. Not all browsers equally support different technologies, markup, etc. For example, Internet Explorer is the scourge of all developers. For example, our site does not support IE 10 and younger, as well as Safari 7.0 and younger, Opera, FF and Chrome under ~ 20 versions. In these browsers you can see wild unbridled bugs - be careful. Perform a test on one of them for clarity.

13. Is it possible to work with site materials when CSS is disabled or in a browser where there is no CSS support?
-
The application may work for people whose browser does not support CSS or CSS support is disabled. If the pages are properly structured, such visitors will not have any problems when working with them.
14. Does the site look correct when printed?
-
You can attach a style to any (X) HTML document for printing, and you don’t need to touch the markup of the document itself. Check what the site looks like when printed, for this it’s enough to save the page as a pdf document and print it when printing.
15. Does the site work on mobile devices?
-
There is currently no uniformity in how handheld devices support Web pages. However, some page layout solutions are better supported on handhelds than others. Support for handheld devices depends on the target audience of your site. Check the site in the mobile chrome mod and in the smartphone browser
16. Does the site have a detailed set of metadata?
-
Metadata - data about data: catalogs, directories, registers, metadata databases containing information on the composition of the data, content, status, origin, location, quality, etc. Metadata is sometimes seen as a variation of the long-established practice of library cataloging, but this is not entirely true. Rather, it is information for Internet robots, search engines and other classifiers of sites.
Check for metadata here:
See http://www.seocentro.com/tools/search-engines/metatag-analyzer.html
17.Does the site work in windows of various sizes?
Very important check. You need to make sure that the layout of the site displays everything correctly when the browser window is reduced (just zoom out, then zoom out and update). Also, when the window is enlarged on a large monitor and if there is a window scroll.

Web usability basics
18. Does the page have a clear visual hierarchy of elements?
-
Important information should be highlighted using sizes, indents, and logical relationships
19. Is it easy to distinguish one level of headings from another?
-
Use headings to expand the structure of documents, while using them in accordance with the specification
See http://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-logical-headings
20. Is site navigation easy enough to understand?
-
Your site’s navigation should tell the visitor which page of the site he’s currently on and where he can follow
21. Is monotonous navigation used on all pages of the site?
-
If on every page of your site the navigation follows the same style, it will be easier for visitors to work with the site and they will find the information they need faster
22. Does the site use an acceptable and uniform language of texts?
-
A clear and simple language of materials allows you to conduct effectively a dialogue with the visitor. Do not forget that your site can be read by users for whom your language is not native
23. Does the site have a map and a page with contact information? Is it easy to find them?
-
Most site maps fail to reveal the layered structure of the site architecture. In usability tests, users often ignore the site map or simply cannot find it. The complexity of the map is also a problem: the map must be a map, not a puzzle on navigation
24. If your site is very large, is there a search tool on it?
-
For a small site, the search function is not particularly needed. There will always be people who never use the site search. However, the search function is an additional good site navigation tool for visitors
25. Is there a link to its main page on every page of the site?
-
Many users digging into the depths of the site want to quickly get to its main page. The main page is, as it were, the starting point for such users, where they reassemble themselves with strength to dive into the new depths of the site
26. Are links underlined?
-
For completeness of perception by users of links, the text of links should be issued in a different color and underlined. Visitors should not rush around the page in search of links
27. Are links that the user has already visited clearly marked in color?
-
Most importantly, if the links that the user has already visited are clearly marked, he will not click on them by accident, and will not go to the same page that he has already visited

I was thinking ... master, isn't there too much information, my brains are already melting?
Labor each brings its own reward. May the force come with you, the future great tester!

What does Agile board look like at work. It is very convenient to attach notes with tasks, and those responsible for them on the board.



Site management
28. Does the site have a clear and useful 404 error page that works from any level of the site?
-
How error 404 is handled (page missing) - the user must know what happened. The visitor should not “fall into nothing” and should know how to get out of this situation
29. Does the site use friendly URLs?
-
Most search engines (with the exception of, for example, Google) will not index pages that have a character "?" or some other character (say "&" or "=")
-
From the point of view of the user interface, the worst thing is the URLs. Nevertheless, if they are short, logical and self-correcting (automatic redirection to the "correct" addresses), it becomes convenient to work with them
30. Self-healing URLs:
-
A browser user may enter a URL with an error, for example, instead of "google.com", "googel.com"
-
Organizations often register such domains "in error" and redirect them to the "correct" addresses
-
For example, the addresses "example.com" and "example.net" can both redirect to a single domain or the web page "example.org"
31. Is it possible to access the site by typing the address without "www"?
-
It is always important that a visitor can type the name of your site without accessing www
32. Does the site have a bookmark icon?
-
The absence of a favicon icon - a graphic file with a picture in several resolutions - leads to 404 errors, because browsers such as IE always ask the server for this icon when the user places a link to the site in bookmarks. If this icon is not on your site, the error "404 File not found" will be logged. So the presence of such an icon will help you significantly reduce the size of the error file

Oh it was a difficult topic. You can be proud of yourself, with this knowledge you can overcome the dark forces. And test any WEB application!
Obi Wan - you're right, our tester learned everything, now he can calmly fight the dark side of Web errors!


Web Application Testing Theses
1. When we see a mistake on the part of the client, we see a symptom of the error, but not of the error itself
For example, in the process of testing a Web application, create a new record and get an error message: Microsoft OLE DB Provider for ODBC Drivers error '8004014'.
In the process of research it is discovered - the problem is that JavaScript on the browser side is not active. JavaScript activation fixes the error.
2. Errors are environment dependent and may not occur in different environments
-
For example, when you try to enter a Web application using a GPRS connection at a speed of 56.2 kb / s, you get registration errors
-
However, registration in the network, performed in the same manner, but using a higher-speed connection, will be successful
-
We have an error related to network bandwidth
Recommendations:
Duplicate the exact sequence of actions and environmental conditions in which the application will run according to the established requirements for the normal application environment
Error analysis in a web environment
It can be difficult to determine what caused the error:
-
is it a code error or is it the result of a software failure
-
server side configuration problem
-
incompatibility issues
-
problems with browser configuration or something else
It is proposed to analyze errors in the Web environment using the exception method, i.e. try to exclude the following points:
-
Web Server Virtual Directory (IIS) has not been installed properly
-
The application directory was not configured as it should for scripts to run correctly
-
The default web page was not installed properly
-
(SQL server) database server is inactive (often met)
-
DLL / COM objects missing or not successfully registered
-
Browser side JavaScript settings have been deactivated

Why is it important to understand the cause of the error?
Because no one likes false alarm. It often happens that the test server (stand) was not configured correctly, either failed, or the database failed. Unlike a battle server, no one really watches him and often, a lot of things fail. Especially due to frequent experiments and reboots. It is important not to scream right away - "the boss is all gone", but to figure out the cause of the error, because failures in the test system are not bugs, but environmental problems that are addressed to system administrators, not programmers.

The main sources of errors in the Web environment
Before reading, you should understand that there is an error ≠ bug. In this context, the error is a kind of test environment problem that interferes with the testing process. It is important to distinguish configuration problems from real bugs in the system. Further details about such errors
The web server virtual directory (IIS) was not installed properly:
-
When the virtual directory is not configured correctly, the requested files, scripts or data will not be detected
-
This is usually a server configuration issue
The application directory was not configured as follows for the correct execution of scripts:
-
The standard directory of the application server contains scripts that are executed when they are called by the Web server at the request of the client
-
For security reasons, the Web server can be configured to either allow or block the execution of scripts within separate directories
-
And if the application server is created in such a way that it contains scripts to be executed, and the Web server is configured in such a way as to block their execution in this directory, then the application will not work
The default web page was not installed properly:
The web server cannot detect the default web page and the application will not work properly
SQL server inactive
-
The application server requires a connection to the database node located on the SQL server for:
-
Making requests
-
Conservation procedures
-
Data access
If the database server maintenance process is not running, then obviously the application will not work
DLL / COM objects missing or not successfully registered
-
For example, the installation program could not copy all the DLL files used by the application server during installation
-
If any DLL file necessary for the application server to work is missing, the application will not work
-
If the application tries to access a COM object that has not been successfully registered, the application will also not work
Browser side JavaScript settings have been deactivated
-
If the JavaScript settings were deactivated, then as soon as the application asks the browser to unlock JavaScript, an error occurs

Browser Settings. Search for errors in scripts
-
When errors occur in JavaScripts that are executed on the client side, it is sometimes difficult to determine where the error occurred. To facilitate the analysis of errors, you can use a special script debugger
-
You need to open the error console in the browser to do this (see the training video)
-
Then you need to repeat the error. See what exception (exceptions and errors) will occur in the console. In the line with the error, click on the link to the JS code in which the error occurred
-
In the window that opens, one of the lines will be highlighted. It was in her that the error occurred. A screenshot of the error that occurred along with the state of the site must be attached to the bug. A line of code in which the problem occurred and the full text of the error may also be useful
Scripting error video recording

That beautiful feeling when fulfilled all the evil plans
What browser settings affect
In the browser settings, you can set the following settings:
-
Home page: set page display when starting a Web browser or when selecting the [Home] menu
-
View: set the conditions for displaying the contents of the page when it is opened (images, animations, JavaScript, Flash, memory savings)
If [Memory Saving] is set to [On], less memory is used to display the Web page. As a result, you can display Web pages containing more data, but the image quality will be lower
-
Connections: set the method for choosing a connection to use when
internet connection
-
Proxy server: enter information about proxy server settings, use / not use proxy server
-
Cookie: specify the method of working with cookies - all cookies are allowed / blocked, or each time a cookie is requested, permission or blocking is requested
-
Temporary files: You can set the memory size of temporary files. If the size is exceeded - files are automatically deleted
-
Opt out of browser security service

Default Browser Settings
-
If the problem is caused by damaged or incompatible parameters, or by additional components of Internet Explorer, you can usually solve it by resetting Internet Explorer

Панель изменений языка


Caching settings

Content Settings

Network settings

HTTPS / SSL settings


Practice and tests

Hello again, seeking the power of testing. As Chewbaka already said - the task of the level is to go through the WEB check sheet for two sites, and compare what errors will be on each of the sites.
Please note that it is important to justify each of the selected statuses specified by you and indicate the reason in the comment. For example: the print version looks correct, the screenshot is http: // .... Send the completed table through the form.
And may the spirit of testing come with you. Also, I think it’s not difficult for you to pass a theoretical test after that
You need to get at least 25,2 points (60%) for tasks of level 10 to go to level 11!

There is no time to relax, another important topic awaits us!
Overview of browsers for a tester
Your attention is given a list of major browsers. Each of them must be installed at the WEB tester, this is an axiom.
P.S. versions are constantly updated and you need to have the latest browser
-
Google Chrome 49
-
Internet Explorer 11/Edge
-
Mozilla Firefox 45
-
Safari 9.1 / MacOS only
-
Opera 36 / dropped out of the top browsers
The Opera browser has recently gained about 1% popularity and is dropping out of support for basic WEB services, which further enhances its lag.
Safari for Windows is no longer supported by the manufacturer, therefore it is not involved in testing.
IE 10 and younger versions of Internet Explorer still have a market share, which provides a regular headache for developers, as they are partially supported browsers (at least for Galaxy QA Academy).
In addition, a new "superbrowser" from Microsoft. Internet Explorer Edge shipped with Windows 10. Fresh smack for all web developers since it supports those web technologies that it wants, and you still have to find out is this a bug in yours or in its functionality?

The popularity of major browsers

Browser Performance
You probably have long wanted to know which browser is cooler, and which browser to use as the main one for work? Let's find out.
One of the most important parameters of browsers is speed, which affects the overall impression of the speed of the program:
-
Cold and Hot Start Speed
-
CSS, scripts, tables, graphics rendering speed
-
Cache speed
-
Cold start. The first download of the browser immediately after the start of the system, while special pre-load utilities are not used. In the performance test, IE gets a head start, many of whose components load simultaneously with Windows
-
Hot start.Second time browser download
-
Rendering tables. In this test, the download speed of the local copy of the page was measured
-
Script processing. A test in which various parameters are measured: calculating mathematical formulas, DHTML processing a string, caching images, speed of manipulating tables, windows and page contents
-
Graphics Display. The test shows how the browser can work with many connections at the same time, as well as how quickly it renders images
-
Work with a cache. Checking browsers using cache
Browser Performance Graph
1. RAM consumption for 3 tabs
2. CPU utilization % for 3 tabs
3. RAM consumption for 30 tabs
4. CPU utilization % for 30 tabs

Fresh info on the site



