WordPress.org
Get WordPress

Plugin Directory

Changeset 3296434


Ignore:
Timestamp:
05/19/2025 12:16:45 PM (11 months ago)
Author:
oowpress
Message:

1.5

  • Fixed: InvalidCharacterError in btoa when handling Unicode characters (e.g., Chinese, emojis) in inline styles by adding safeBase64Encode function. Credits to @long-dotcom for identifying the issue and suggesting a solution.
  • Improved: Enhanced applyStylesheetsAsync to use safeBase64Encode for robust style management with non-Latin1 characters.
  • Fixed: Minor JSDoc typo in isCacheValid for improved documentation clarity.
Location:
oow-pjax
Files:
46 added
2 edited

Legend:

Unmodified
Added
Removed

  • oow-pjax/trunk/assets/js/oow-pjax.js

    r3282551 r3296434  
    22 * OOW PJAX JavaScript - Handles PJAX (PushState + AJAX) navigation with space-separated selectors and custom JS support.
    33 * @module OOWPJAX
     4 * @credits Special thanks to @long-dotcom for identifying the btoa InvalidCharacterError issue with Unicode characters
     5 *          and suggesting a safeBase64Encode solution to handle non-Latin1 characters in inline styles.
    46 */
    57
    … …  
    221223  }
    222224
    223 
    224225  /**
    225226   * Extracts stylesheets (<link> and <style>) from an HTML document.
    … …  
    230231    const stylesheets = [];
    231232   
    232     // Récupérer les balises <link rel="stylesheet">
     233    // Retrieve <link rel="stylesheet"> tags
    233234    const linkElements = doc.querySelectorAll('link[rel="stylesheet"]');
    234235    linkElements.forEach((link) => {
    … …  
    239240    });
    240241
    241     // Récupérer les balises <style>
     242    // Retrieve <style> tags
    242243    const styleElements = doc.querySelectorAll('style');
    243244    styleElements.forEach((style) => {
    … …  
    250251    log('Stylesheets extracted:', stylesheets);
    251252    return stylesheets;
     253  }
     254
     255  /**
     256   * Encodes a string to base64, safely handling Unicode characters.
     257   * @param {string} str - String to encode.
     258   * @returns {string} Base64-encoded string.
     259   * @credits Inspired by @long-dotcom's suggestion to handle Unicode characters in btoa.
     260   */
     261  function safeBase64Encode(str) {
     262    try {
     263      return btoa(
     264        encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, (match, p1) =>
     265          String.fromCharCode(parseInt(p1, 16))
     266        )
     267      );
     268    } catch (error) {
     269      log('Error during base64 encoding for stylesheet:', error.message);
     270      console.error('Error during base64 encoding:', error);
     271      return btoa(''); // Fallback value
     272    }
    252273  }
    253274
    … …  
    291312          }
    292313        } else if (stylesheet.tag === 'style') {
    293           if (!document.querySelector(`style[data-content="${btoa(stylesheet.content)}"]`)) {
     314          // Check if style already exists using safeBase64Encode
     315          const encodedContent = safeBase64Encode(stylesheet.content);
     316          if (!document.querySelector(`style[data-content="${encodedContent}"]`)) {
    294317            const style = document.createElement('style');
    295318            style.textContent = stylesheet.content;
    296             style.setAttribute('data-content', btoa(stylesheet.content));
     319            style.setAttribute('data-content', encodedContent);
    297320            document.head.appendChild(style);
    298321            log('Inline style added');

  • oow-pjax/trunk/readme.txt

    r3282551 r3296434  
    11=== OOW PJAX ===
    2 Contributors: oowpress
     2Contributors: oowpress, long-dotcom
    33Donate link: https://profiles.wordpress.org/oowpress/
    44Tags: pjax, ajax navigation, persistent player, page transition, vanilla javascript
    55Requires at least: 5.0
    66Tested up to: 6.8
    7 Stable tag: 1.4
     7Stable tag: 1.5
    88Requires PHP: 5.2
    99License: GPLv2 or later
    … …  
    2727- **Interactive Landing Pages**: Deliver immersive experiences for marketing campaigns or event sites with uninterrupted navigation.
    2828
    29 Version 1.4 enhances security with dynamic nonce refreshing, improves style management with asynchronous stylesheet handling, and refines form redirect handling, making OOW PJAX more robust for complex WordPress sites.
     29Version 1.5 introduces a critical fix for handling Unicode characters (e.g., Chinese, emojis) in inline styles, preventing `InvalidCharacterError` issues with `btoa`. This update, contributed by **@long-dotcom**, ensures robust style management for multilingual and emoji-rich sites. It also enhances security with dynamic nonce refreshing, improves asynchronous stylesheet handling, and refines form redirect handling, making OOW PJAX more reliable for complex WordPress sites.
    3030
    3131### Key Features
    … …  
    4343- **Secure Implementation**: Uses dynamic nonces, sanitization, and strict validation for all settings and AJAX requests.
    4444- **Script Priority Control**: Customize the loading order of `oow-pjax.js` in the footer for compatibility.
    45 - **Dynamic Style Management**: Injects and manages page-specific stylesheets and inline styles asynchronously during PJAX transitions.
     45- **Dynamic Style Management**: Injects and manages page-specific stylesheets and inline styles asynchronously, now with Unicode support.
    4646- **Advanced Script Execution**: Re-executes scripts in updated containers or footer, with control over inline scripts and validation.
    4747- **CodeMirror Integration**: Edit Custom JS with syntax highlighting and a Dracula theme.
     48- **Unicode Support for Styles**: Safely handles non-Latin1 characters (e.g., Chinese, emojis) in inline styles without errors (new in 1.5).
    4849
    4950### Who Needs OOW PJAX?
    … …  
    69707. **Form Handling**: Submits forms via AJAX, supporting explicit comment nonces and server-side redirects (e.g., 301, 302).
    70718. **Script Management**: Re-executes scripts in updated containers or footer, with custom JS execution before/after navigation.
    71 9. **Style Injection**: Asynchronously injects page-specific stylesheets and inline styles for consistent rendering.
     729. **Style Injection**: Asynchronously injects page-specific stylesheets and inline styles, now with robust Unicode support.
    7273
    7374### Getting Started
    … …  
    121122
    122123= Does it support AJAX form submissions? =
    123 Yes, enable **Enable Form Handling** to submit forms (e.g., comments, login, contact) via AJAX. Version 1.4 enhances this with explicit comment nonce support, dynamic nonce refreshing, and robust redirect handling (e.g., 301, 302).
     124Yes, enable **Enable Form Handling** to submit forms (e.g., comments, login, contact) via AJAX. Version 1.5 enhances this with explicit comment nonce support, dynamic nonce refreshing, and robust redirect handling (e.g., 301, 302).
    124125
    125126= How do I style the loading animation? =
    … …  
    141142Yes, use the **Custom JS** tab to add JavaScript before or after PJAX navigation with CodeMirror’s syntax highlighting.
    142143
    143 = How does version 1.4 improve form handling? =
    144 Version 1.4 builds on version 1.3 by adding dynamic nonce refreshing for form submissions and improved redirect handling, ensuring compatibility with complex forms and reducing nonce expiration errors.
     144= How does version 1.5 improve style handling? =
     145Version 1.5 adds support for Unicode characters (e.g., Chinese, emojis) in inline styles, fixing `InvalidCharacterError` issues with `btoa`. Thanks to @long-dotcom for the contribution.
    145146
    146147= How does OOW PJAX handle page-specific styles? =
    147 Version 1.4 introduces asynchronous stylesheet management, extracting and applying `<link>` and `<style>` tags during PJAX transitions to ensure consistent rendering without duplicates.
    148 
    149 = Why are nonces refreshed dynamically in version 1.4? =
     148Version 1.5 enhances asynchronous stylesheet management, extracting and applying `<link>` and `<style>` tags during PJAX transitions, with full Unicode support for consistent rendering.
     149
     150= Why are nonces refreshed dynamically? =
    150151Dynamic nonce refreshing prevents errors from expired nonces during long sessions or high-traffic scenarios, enhancing security and reliability for AJAX requests.
    151152
    … …  
    159160
    160161== Changelog ==
     162
     163= 1.5 =
     164* **Fixed**: `InvalidCharacterError` in `btoa` when handling Unicode characters (e.g., Chinese, emojis) in inline styles by adding `safeBase64Encode` function. Credits to @long-dotcom for identifying the issue and suggesting a solution.
     165* **Improved**: Enhanced `applyStylesheetsAsync` to use `safeBase64Encode` for robust style management with non-Latin1 characters.
     166* **Fixed**: Minor JSDoc typo in `isCacheValid` for improved documentation clarity.
    161167
    162168= 1.4 =
    … …  
    209215== Upgrade Notice ==
    210216
     217= 1.5 =
     218Upgrade to version 1.5 for robust Unicode support in inline styles, fixing `InvalidCharacterError` with `btoa`. This update, contributed by @long-dotcom, enhances compatibility with multilingual and emoji-rich sites, alongside improved style management. Recommended for all users.
     219
    211220= 1.4 =
    212221Upgrade to version 1.4 for dynamic nonce refreshing, asynchronous stylesheet management, and improved form redirect handling. This update enhances security, compatibility with dynamic styles, and debugging capabilities. Recommended for all users.
Note: See TracChangeset for help on using the changeset viewer.