Testing, debugging and quality assurance for Wix apps
Module 47: How to Build a Wix App: Complete Developer Guide | Lesson 538 of 688 | 50 min read
By Michael Andrews, Wix SEO Expert UK
Testing is the difference between an app that gets approved on the first submission and one that bounces back repeatedly with rejection notices. Wix reviewers are thorough, and users are unforgiving of bugs. This lesson covers every testing strategy you need: unit tests, integration tests, Wix test sites, debugging tools, error monitoring and the complete pre-submission quality checklist.
The Testing Pyramid for Wix Apps
A solid testing strategy follows the testing pyramid: many unit tests at the base, fewer integration tests in the middle, and a small number of end-to-end tests at the top. Each layer catches different types of bugs.

- Unit tests (70%): Test individual functions, utilities, data transformations and business logic in isolation
- Integration tests (20%): Test API interactions, database operations and component rendering with mocked Wix SDK
- End-to-end tests (10%): Test complete user flows on actual Wix test sites - install, configure, use, uninstall
Unit Testing App Components and Backend Code
Unit tests verify that individual pieces of your code work correctly in isolation. For Wix CLI apps, use Jest or Vitest for testing React components and backend functions.
// __tests__/seo-audit.test.ts
import { describe, it, expect } from 'vitest';
import { auditProductSeo, calculateSeoScore } from '../src/public/seo-utils';
describe('SEO Audit Functions', () => {
it('should return 100 for a fully optimised product', () => {
const product = {
seoTitle: 'Premium Leather Wallet - Handcrafted Italian Design',
seoDescription: 'Discover our handcrafted Italian leather wallet. Premium quality, RFID blocking, multiple card slots. Free shipping on orders over $50.',
images: 3,
hasAltText: true,
};
const result = auditProductSeo(product);
expect(result.seoScore).toBe(100);
expect(result.issues).toHaveLength(0);
});
it('should flag missing SEO title', () => {
const product = {
seoTitle: '',
seoDescription: 'A valid description that is long enough',
images: 2,
hasAltText: true,
};
const result = auditProductSeo(product);
expect(result.seoScore).toBeLessThan(100);
expect(result.issues).toContain(
expect.stringContaining('SEO title')
);
});
it('should flag short meta description', () => {
const product = {
seoTitle: 'Valid Title for SEO Purposes Here',
seoDescription: 'Too short',
images: 1,
hasAltText: true,
};
const result = auditProductSeo(product);
expect(result.issues).toContain(
expect.stringContaining('Meta description')
);
});
it('should calculate aggregate score correctly', () => {
const pages = [
{ score: 80 },
{ score: 60 },
{ score: 100 },
];
expect(calculateSeoScore(pages)).toBe(80);
});
});
Integration Testing with Wix APIs
Integration tests verify that your code correctly interacts with Wix APIs. Since you cannot call real Wix APIs in a test environment, you mock the SDK and verify your code sends the right requests and handles responses correctly.
- Mock the Wix SDK using Jest/Vitest mock functions for wixData.query, wixData.insert, etc.
- Test that your code handles API error responses gracefully (network errors, permission errors, rate limits)
- Verify that your code correctly transforms Wix API response data into the format your UI expects
- Test pagination logic with mocked responses that simulate multi-page result sets
- Test that your webhooks handler processes event payloads correctly with sample event data from the Wix docs
End-to-End Testing on Wix Test Sites
Complete E2E testing workflow for Wix apps
- Set up a dedicated Wix test site with Wix Stores, Bookings and Blog installed. Populate it with sample data (products, services, blog posts).
- Install your app on the test site using wix dev. Walk through the complete first-time user experience as if you were a new user.
- Test every dashboard page: settings save and load correctly, analytics display data, lists paginate properly.
- Test every site widget: renders correctly on desktop and mobile, responds to configuration changes, handles loading and error states.
- Test the uninstall flow: uninstall the app and verify it cleans up properly. Reinstall and verify settings are restored or reset as expected.
- Test on a published site (not just the editor preview). Some behaviours differ between editor and live site.
Debugging Tools and Strategies
- Browser DevTools: Use the Console, Network and React DevTools tabs to debug dashboard pages and site widgets
- Wix CLI logs: The "wix dev" terminal output shows server-side logs, errors and API call traces
- Wix Developer Centre: Check the app errors tab for production errors reported from installed sites
- Source maps: Enable source maps in your build configuration for readable stack traces in production
- Error boundaries: Wrap React components in error boundaries to catch rendering errors gracefully
- Structured logging: Use a consistent log format (timestamp, level, context, message) for easier debugging
Pre-Submission Quality Checklist (50 Points)
Before submitting your app to the Wix App Market, run through this comprehensive quality checklist. Address every item to maximise your chances of first-time approval.
- Functionality (15 pts): All features work as described, no JavaScript errors in console, all API calls succeed, error states handled
- Performance (10 pts): Dashboard pages load in under 2 seconds, site widgets render in under 1 second, no memory leaks, images optimised
- Responsiveness (10 pts): Dashboard works on 1024px+ screens, widgets work 280px-1200px, no horizontal scroll, touch targets 44px+
- Accessibility (5 pts): Keyboard navigable, screen reader compatible, colour contrast AA compliant, focus indicators visible
- Design quality (5 pts): Uses Wix Design System for dashboard, consistent styling, professional appearance, proper spacing
- Error handling (5 pts): Network errors handled gracefully, loading states shown, empty states designed, user-friendly error messages
How to Run a Complete Quality Assurance Check Before Wix App Submission
Follow these steps to systematically test your Wix app across all critical quality dimensions before submitting to the App Market, maximising your chances of first-attempt approval.
Running the full pre-submission quality assurance workflow
- Step 1: Run your full unit test suite using vitest run or jest and confirm all tests pass with zero failures. If any test is failing, fix the underlying bug before proceeding. Do not suppress or skip failing tests.
- Step 2: Start the app in development mode using wix dev and install it on your dedicated Wix test site. Walk through the entire first-time user journey: install, see the welcome screen, complete setup, use the main feature, and check that the result is correct.
- Step 3: Open Chrome DevTools Console while using every dashboard page and site widget. Confirm there are zero JavaScript errors, zero network 404 errors and zero console warnings about deprecated API usage.
- Step 4: Test every error state deliberately: disconnect your network while the dashboard is loading, test with an empty database (delete all test data first), simulate a 401 response by temporarily revoking permissions. Confirm the app shows a user-friendly error message in all cases.
- Step 5: Test on mobile widths using Chrome DevTools responsive mode. Set width to 375px (iPhone SE), 768px (iPad) and 1024px (minimum desktop). Site widgets must render correctly at all widths. Dashboard pages must work at 1024px minimum.
- Step 6: Run Google Lighthouse against your site widget's rendered HTML (inspect the live site, not editor preview). Target a Performance score of 90+ and an Accessibility score of 90+. Fix any critical accessibility issues (missing alt text, low colour contrast, missing ARIA labels).
- Step 7: Test the complete uninstall flow: uninstall your app from the test site and verify that any collections or data your app created are cleaned up properly, or that the data is preserved as expected based on your app's stated behaviour.
- Step 8: Reinstall the app on the same test site that previously had it installed. Verify that returning users see their previous settings restored if appropriate, or that the fresh install flow works without errors.
- Step 9: Test on a fully published Wix site (click "Publish" in the Wix Editor and open the live URL). Verify that your site widget renders correctly on the published site, not just in editor preview mode, as some SDK behaviours differ between environments.
- Step 10: Walk through all 50 points of the pre-submission quality checklist above and record a score for each section. Do not submit until functionality, performance, responsiveness, accessibility, design and error handling all score at least 80% of their available points.
This lesson on Testing, debugging and quality assurance for Wix apps is part of Module 47: How to Build a Wix App: Complete Developer Guide in The Most Comprehensive Complete Wix SEO Course in the World (2026 Edition). Created by Michael Andrews, the UK's No.1 Wix SEO Expert with 14 years of hands-on experience, 750+ completed Wix SEO projects and 425+ verified five-star reviews.