UI Test Cases For Web Application

UI Test Cases For Web Application: Writing test cases for web applications is important, but it can be a tedious task. In this article, we will look at a few common web application elements and how you can use test cases to help developers write better code and reduce bugs.

Web application developers have been having a tough time finding a way to test the usability of their apps. With the rise of progressive web applications, testing is now even more important.

Post On:	UI Test Cases For Web Application
Post Type:	Test Case With Example
Published On:	www.softwaretestingo.com
Applicable For:	Freshers & Experience
Join Here:	Telegram Group Link

Test Scenario Web Application

This white paper covers the following topics:

• Test Case For Button
• Test Case For Textbox
• Test Case For Searchbox
• Test Case For Radiobutton
• Test Case For Links/Link text
• Test Case For Flash Images
• Test Case For RSS

In this article, we will be discussing test cases for web application elements that can help developers and designers to create quality applications.

Test Case For Button

• Check whether the button is properly visible and in proportion with UI
• Verify whether the size of the button is as per the requirement
• Verify color of the button is as per the requirement
• Verify text present on the button is as per the requirement
• Verify text present on the button is visible
• Verify text font and text color are as per the requirement
• Verify the user is able to click the button
• On hover to button verify mouse tip is changed to hand
• On hover to button verify the color of the button is changed
• Verify the user is able to perform the required function when clicking on a button

Test Case For Textbox

• Check whether the textbox is properly visible and in proportion with UI
• Verify whether the size of the textbox is as per the requirement
• Check whether the user is able to enter text in the textbox
• Verify text entered in the textbox is visible to the user
• Check the font size and font color of the text entered in the textbox as per the requirement
• Check whether the textbox gives any hint/placeholder for the user regarding what to enter in the textbox
• Verify if a user is able to enter any type of characters required by the user in the textbox
• Verify if the user can clear or delete the text written in the textbox
• Verify textbox is able to take the maximum length of text for which it is designed

Test Case For Searchbox

• Check whether Searchbox is properly visible and in proportion with UI
• Verify whether the size of the Searchbox is as per the requirement
• Check whether the user is able to enter the required text in the search box
• Verify whether the search box is giving any autosuggestions for text to be searched
• Check the font size and font color of the text entered in the search box as per the requirement
• Verify text entered in the search box is visible to the user
• Check whether the search box gives any hint/placeholder for the user regarding what to search in the search box
• Verify if a user is able to enter any type of characters required by the user in the search box
• Verify if a user can clear or delete the text written in the search box
• Verify the user is able to select any specific auto search result populated in the search box
• Check whether the search box takes a maximum length of text for which it is designed

Test Case For Radiobutton

• Check whether Radiobutton is properly visible and in proportion with UI
• Verify whether the size of the Radiobutton is as per the requirement
• Check whether the user is able to select the radio button
• Verify proper description of the radio button is given
• Verify the font size and font color of the description
• Verify if the user selects the radio button and then the page is refreshed then still that radio button is selected
• Verify the user is not able to select more than one radio button from one particular radio group
• Verify one radio button does not collide with another radio button in the group
• Verify if the description of the radio button is present next to or close to that radio button only

Test Case For Links/Link text

• Verify if a user is able to click the link
• Verify the user is navigated to some page or desired location
• Verify if the link is clicked then the page opens in the same tab or a different tab as per the requirement
• Verify link is visible to the user and is in proportion with UI
• Verify font color and text are as per the requirement
• Verify text of the link is as per the requirement
• On hover to link check, the mouse cursor changes from tip to hand
• Check if the mouse link is displayed on the bottom left of the browser when hovered to that link

Test Case For Flash Images

• Check the proper generation of the flash text files in the Flash Folder when we are using the flash menus.
• Check the download of the flash images time whether due to this the page loading time is increasing or not
• Check the display of the flash images in all the popular browsers like IE, Mozilla, Chrome, and Safari because sometimes flash images won’t display properly in some of the browsers.
• These may change depending on the requirements.

Test Case For RSS

How the RSS feed is using means for the public site or for the member site

Public site:

• Check the email field validation properly and the remaining checkbox functionalities.
• Check the mail functionality properly and whether the proper RSS feed links are sent to the requested user or not.
• Check if the mail id is not valid and how the application behaves.
• Check the work of the RSS feed link by subscribing to any reader.
• Post the new articles or documents for that list and check whether the newly added details are updated in the reader or not.

Member site:

• Correct member-only getting the RSS feed links or not because for members login, generally, no one will use the email field.
• Group subscribers are used then check whether all the groups are getting the RSS feed links correctly or not.
• Check the work of the RSS feed link by subscribing to any reader.
• Post the new articles or documents for that list and check whether the newly added details are updated in the reader or not.
• If the member was not in use then don’t send any articles or document details to his reader. This is one of the security issues because he was not a member so no need to send him/her the updates of the application. Most of cases this check will miss in the development and testing also.
• Check if the published documents only sending to the requested user or not, some of the articles will prepare for future use but they won’t publish on the site for members but there is a chance that members will get those articles also in the Reader. This point is applicable to all public sites also

Note: This verification of web elements is applicable only for web pages viewed on desktop and laptop browsers.

Conclusion:

In this article, you learned how to check UI test cases for a web application, as well as the elements of writing any test case on a web application. With this knowledge, you should be able to write your own test cases confidently. If you have any questions or problems, please let us know in the comments section below.