Practical Tips for Testing Web Apps

Arvind Padmanabhan

Trustee @ Devopedia Foundation

Overview

#4 Bypass GUI

#5 Dependency Injection & Mocking

#6 CRUD vs Data-first Approach

#7 CAPTCHA

#8 Manage Tokens, API Keys, etc.

#9 Look Under the Hood

#1 Purpose of Testing

#2 Test Configuration

#3 Modular Test Cases

Devopedia Codebase

Architecture

Python/Selenium for test automation
Pytest as the test framework
OWASP ZAP for security testing
GitHub Actions for CI/CD

Testing @ Devopedia

~450 GUI tests

~150 CLI tests

#1 Purpose of Testing

Find Bugs

Validate the product

Tester's perspective

Developer's perspective

Quality is a product of a conflict between programmers and testers.

-- Yegor Bugayenko

#2 Test Configuration

        "default": {
            "php": "php8.1",
            "mysql": "mysql"
        }
    },
    "logs": {
        "main": "../../tmp/mainAppLog.txt",
        "phperr": "../../php_errors.log"
    },
    "online": true,
    "db": {
        "driver": "mysql+pymysql",
        "host": "127.0.0.1",
        "user": "root",
        "pwd": "",
        "name": "test"
    },
    "data": {
        "default":  {
            "src": "data/default.sql",
            "maxids": {
                "acronyms": 211,
                "article_request": 80,
                "chat_msgs": 11710,

Executable paths
Log paths
Database access
Test data source
Database offsets
Browser options
...

Local testing

CI/CD

Staging

#2 Modular Test Cases

"Login" is a test case
- It can executed standalone
- Or it can be part of a longer test sequence
Validation
- Perform full validation (test asserts) when executed standalone
- Should be able to skip when used in non-standalone mode
Login can be seen as a pre-requisite test for "Load Article Form"
An alternative is to implement these as a library of functions

Load Article Form

Save Article

1

The smallest unit of execution is a test case.

3

What test cases and procedures to execute are determined by a test plan.

5

Separate CLI and GUI tests. Separate DB interfacing from main test execution.

2

Test cases executed in a specific sequence is a test procedure.

4

For better reuse, each test case shouldn't do too many things.

#4 Bypass GUI

Exercise server-side validation

Use tools: Postman, curl, etc.

Don't forget client-side validation

#5 Dependency Injection

send_email

write_to_file

write_to_socket

#5 Mocking

App

External Weather Service

Weather API

Weather Mock

#6 CRUD

Create

Read

Update

Delete

#6 Data-first Approach

Read

Delete

Create

Update

Test Data Generator *

* Helps test pagination, filtering, searching, performance, ...

Enabled by

TDD

#7 CAPTCHA

Use an in-house generated CAPTCHA

See recaptcha

Select a CAPTCHA that has a test hook

#8 Manage Secrets

(Tokens, API Keys, Passwords, etc.)

Read from untracked files or environment variables

Don't commit these into the code repo (use .gitignore)

{
    "facebook": {
        "name": "xxx",
        "login": "xxx",
        "password": "xxx",
        "email": ""
    },
    "zap": {
        "apikey": "xxx"
    },
    "OAuth": {
        "bitbucket": {
            "key": "xxx",
            "secret": "xxx"
        }
        ...

Use a Git Hook to catch unintentional commits

#9 Look Under the Hood

Perform HTML validation

Analyze server logs & browser console logs

Detect SEO problems

Study or review dev code

#9 Example Code

As a tester, what test cases can you think of?

Does the code suggest any design problems?

Bonus "Tip"

Software testers always go to heaven; they've already had their fair share of hell.

-- Anonymous

Devopedia

Visit https://devopedia.org & join the movement!

Support us as a reader, writer, editor or donor.

Write to webadmin@devopedia.org