Complete Desktop and Mobile Testing Guide
Use this guide to verify the app from both a PC and a phone before you call a release ready. The goal is simple: catch layout issues, broken flows, permission bugs, and “works on my machine” surprises before they reach users.
Before You Start
Run every automated check available in the app repo before you begin manual testing. In this project, that usually means:
npm test
npm run lint
npm run type-check
npm run buildIf any of those scripts do not exist in the current workspace, run the equivalent test, lint, type, and build checks that are available there. Manual testing should sit on top of a clean automated pass, not replace it.
Test With Two Accounts
Always test with both of these accounts:
- An existing account that already has decks, rooms, and activity history.
- A brand-new account that has no data yet.
That combination catches the most common SaaS bugs:
- Empty states that break for new users.
- Existing-data screens that break when content is already present.
- Permission leaks between users.
- Different session and redirect behavior after sign-in.
Desktop Testing
Use a normal browser window on PC first. Desktop is the best place to confirm the full layout, tables, drag handles, sidebars, and copy actions.
What to verify on PC
- Home page and navigation.
- Login, logout, and session persistence.
- Signup flow for the new account.
- Dashboard empty state for the new account.
- Dashboard populated state for the existing account.
- Deck upload, rename, delete, and reorder flows.
- Data room creation and data room editing.
- Share link generation and clipboard copy.
- Password-protected and email-gated access.
- Analytics and activity counts.
- Error states, loading states, and retry behavior.
- Visual consistency across the main docs and app screens.
PC checklist
- Resize the browser from wide desktop to a narrower window and confirm nothing overlaps.
- Use keyboard navigation for the main actions.
- Open important dialogs and confirm focus stays inside them.
- Verify tables, badges, and cards still look correct with longer names.
- Check that copy-to-clipboard feedback is obvious and immediate.
- Confirm destructive actions ask for confirmation when expected.
Mobile Testing
After the desktop pass, repeat the most important flows on a phone or a mobile emulator. Mobile catches touch target issues, drawer bugs, and content that looks fine on a monitor but breaks on a small screen.
What to verify on mobile
- Home page loads cleanly on a small screen.
- Navigation drawer or bottom navigation works.
- Login and signup are usable with mobile keyboards.
- Forms do not overflow the screen.
- Deck upload flow works from mobile storage or files.
- Data room pages remain readable without horizontal scrolling.
- Share links open correctly in a private tab.
- Password and email-gated pages work on mobile browsers.
- Analytics pages remain usable on narrow widths.
- Buttons, tabs, and menus are easy to tap.
Mobile checklist
- Test at least one Android-style browser and one iPhone-style browser if possible.
- Open the app in a private or incognito tab and verify the unauthenticated flow.
- Rotate the device if the app supports landscape use.
- Confirm the browser address bar, keyboard, and page content do not collide.
- Check that long file names, room names, and emails wrap cleanly.
- Make sure modals and drawers can be closed without precision tapping.
Core User Flows To Recheck
These are the flows that should be rerun whenever anything important changes:
- Signup and login.
- Logout and session restore.
- Create a deck.
- Upload and replace files.
- Create a data room.
- Add and reorder assets in a room.
- Share a room link.
- Open a shared room in a private browser session.
- Protect a room with password and email requirements.
- Expire or revoke access and confirm the link stops working.
- View analytics after a real view.
- Confirm counts do not increase from your own logged-in testing.
Common SaaS Checks
These are the checks that usually matter most in SaaS products and often reveal the hidden bugs:
- Authentication and session handling.
- Role and permission boundaries.
- Empty states versus populated states.
- Email and text validation.
- Input trimming and case handling.
- File upload limits, errors, and retries.
- Loading indicators and skeletons.
- Copy links, share links, and private access.
- Data persistence after refresh.
- Responsive layout across desktop and mobile.
- Accessibility basics like focus, keyboard use, and readable contrast.
- Analytics events firing at the right time.
- Error handling when a request fails or the network drops.
Suggested Test Order
If you want a quick but useful manual pass, use this order:
- Run the automated checks.
- Test the new account on desktop.
- Test the existing account on desktop.
- Test the shared link in a private browser tab.
- Repeat the most important flows on mobile.
- Recheck analytics only after a real external view.
Notes While Testing
- Keep track of any step that feels slow, confusing, or inconsistent.
- Note whether the problem happens only on desktop, only on mobile, or on both.
- If a bug affects one account but not the other, record which account exposed it.
- If you change auth, routing, uploads, or sharing, always rerun the full flow instead of only the touched screen.
Need Help?
If a flow is unclear or a screen feels broken, call it out early. The best QA notes are specific: what device you used, which account you tested, what you expected, and what actually happened.
