Fix feed importer and categories

[devbodaghe]

Description

This PR fixes critical performance and functionality issues in the Facebook for WooCommerce plugin's Google Product Category system that were causing browser crashes and "Page Unresponsive" errors.

Primary Issue: The plugin was loading all 5,582 Google product categories (525KB of JSON data) into the browser simultaneously, overwhelming memory and causing crashes, particularly on product edit pages for feed-imported products.

Root Cause: Feed-imported products with Google Product Categories containing HTML entities (like 'Clothing & Accessories > Clothing > Shirts & Tops') triggered loading of the entire category dataset during hierarchy reconstruction, exhausting browser memory.

Solution: Implemented progressive loading architecture that reduces initial payload from 525KB to ~6KB (98.9% reduction) while maintaining full functionality through on-demand AJAX loading.

Additional Fixes:

• Restored Enhanced Catalog Attributes ("Show More Attributes") functionality that was broken
• Fixed category persistence for both feed-imported and manually created products
• Resolved duplicate AJAX handlers causing UI duplication
• Fixed CSS styling issues and removed unwanted white space
• Added support for category name/path resolution from feed imports
• Improved error handling with graceful fallbacks

Dependencies: No new dependencies required. Uses existing WordPress AJAX infrastructure.

Type of change

• Bug fix (non-breaking change which fixes an issue)
• Performance improvement (non-breaking change which improves efficiency)

Checklist

• I have commented my code, particularly in hard-to-understand areas.
• I have confirmed that my changes do not introduce any new PHPCS warnings or errors.
• I have checked plugin debug logs that my changes do not introduce any new PHP warnings or FATAL errors.
• I followed general Pull Request best practices.
• I have added tests (if necessary) and all the new and existing unit tests pass locally with my changes.
• I have completed dogfooding and QA testing, or I have conducted thorough due diligence to ensure that it does not break existing functionality.
• I have updated or requested update to plugin documentations (if necessary).

Changelog entry

Fix Google Product Category browser crashes by implementing progressive loading (6KB vs 525KB), restore Enhanced Catalog Attributes functionality, and improve category persistence for imported products.

Test Plan

Test Environment:

• WordPress with WooCommerce and Facebook for WooCommerce plugin
• Products imported from feed files with Google Product Categories
• Manually created products with Google Product Categories

Test Cases:

1. Performance Test:

   • Navigate to product edit page for feed-imported product (previously crashed)
   • Verify page loads without "Page Unresponsive" errors
   • Confirm Google Product Category dropdowns render properly
   • Measure network payload (should be ~6KB vs previous 525KB)

2. Category Persistence Test:

   • Edit feed-imported product with existing category (e.g., "Clothing & Accessories > Clothing > Shirts & Tops")
   • Verify category dropdowns show correct selection hierarchy
   • Save product and reload - confirm category persists
   • Repeat with manually created product

3. Enhanced Attributes Test:

   • Select valid Google Product Category (2+ levels deep)
   • Verify "Show More Attributes" checkbox appears
   • Check checkbox and confirm additional attribute fields display
   • Verify no duplicate "Show More Attributes" checkboxes

4. Progressive Loading Test:

   • Open category dropdown - verify top-level categories load
   • Select category - verify children load dynamically via AJAX
   • Navigate through category hierarchy - confirm smooth operation
   • Monitor network tab for AJAX requests

Screenshots

Before

• Browser "Page Unresponsive" dialog when editing products with Google Product Categories
• Network tab showing 525KB payload for Google Product Category data
• Missing "Show More Attributes" functionality
• Empty category dropdowns on feed-imported products
• Duplicate "Show More Attributes" checkboxes appearing

After

• Product edit pages load smoothly without crashes
• Network tab showing ~6KB initial payload with progressive AJAX loading
• Google Product Category dropdowns properly display hierarchical selection
• "Show More Attributes" functionality working correctly (single checkbox)
• Feed-imported products show correct category selections
• Enhanced attributes fields appear when valid categories selected
• Clean UI with proper CSS styling and no unwanted white space

Performance Metrics:

• Initial payload: 525KB → 6KB (98.9% reduction)
• Page load time: Improved significantly
• Memory usage: Drastically reduced
• Browser crashes: Eliminated

[facebook-github-bot]

@devbodaghe has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

[facebook-github-bot]

@devbodaghe has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

[facebook-github-bot]

@devbodaghe has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

[facebook-github-bot]

@devbodaghe has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.

[facebook-github-bot]

@devbodaghe has imported this pull request. If you are a Meta employee, you can view this diff on Phabricator.