Skip to content

Conversation

@rosinghal
Copy link
Member

@rosinghal rosinghal commented Aug 6, 2025

🐛 Problem

Event bubbles do not work when clicking on calendar dots/events when WPML (WordPress Multilingual Plugin) is activated. This causes JavaScript errors
(getClientRects is not a function) and prevents users from viewing event details on multilingual sites.

Related Issues:

🔍 Root Cause

  1. AJAX URL generation doesn't account for WPML's language parameters
  2. When WPML is active, it modifies URLs to include language codes, but Simple Calendar's AJAX calls don't include the proper language context
  3. This causes AJAX requests to fail, preventing event bubble content from loading
  4. qTip2 library fails when trying to position bubbles with missing content, resulting in getClientRects errors

💡 Solution

Implemented comprehensive WPML compatibility by:

1. Enhanced AJAX URL Generation (includes/main.php)

  • Modified ajax_url() method to detect WPML activation
  • Automatically adds language parameter (lang=en, lang=es, etc.) to AJAX URLs when WPML is active

2. Language-aware JavaScript Variables (includes/functions/shared.php)

  • Added current WPML language code to JavaScript variables passed to frontend
  • Ensures frontend scripts have access to current language context

3. Updated AJAX Requests (assets/js/default-calendar.js)

  • Modified both grid and list view AJAX calls to include WPML language parameter
  • Ensures calendar navigation works correctly across all languages

4. Error Handling Improvements

  • Added try-catch blocks around qTip2 initialization
  • Prevents JavaScript errors from breaking calendar functionality
  • Graceful degradation when bubble initialization fails

📁 Files Changed

  • google-calendar-events/includes/main.php
  • google-calendar-events/includes/functions/shared.php
  • google-calendar-events/assets/js/default-calendar.js

✅ Testing

  • Event bubbles work with WPML activated
  • Calendar navigation functions across language switches
  • No JavaScript errors in browser console
  • Backward compatibility maintained for non-WPML sites

📈 Impact

  • Fixes critical functionality for multilingual WordPress sites
  • Improves user experience for international customers
  • Maintains existing functionality for monolingual sites
  • Resolves support tickets related to WPML compatibility

🔧 Add-on Compatibility

No updates required for premium add-ons as they rely on the core plugin's calendar rendering and AJAX systems.

Summary by CodeRabbit

  • New Features

    • Calendar requests now respect the current site language (WPML compatibility).
  • Bug Fixes

    • Improved error handling for event tooltips to prevent UI breakage.
  • Documentation

    • Minor formatting and whitespace cleanup in documentation (no content changes).

@coderabbitai
Copy link

coderabbitai bot commented Aug 6, 2025

Walkthrough

Adds WPML language propagation to frontend scripts and AJAX (via localized vars, AJAX payload, and ajax_url), wraps qTip2 tooltip initialization in a try/catch with console warnings, and applies formatting-only edits to documentation (CLAUDE.md). No public API or exported declarations changed.

Changes

Cohort / File(s) Change Summary
WPML: localized script variables
includes/functions/shared.php
simcal_common_scripts_variables() now includes wpml_language (ICL_LANGUAGE_CODE) in the array sent to JS when WPML is active.
WPML: AJAX URL handling
includes/main.php
Plugin::ajax_url() assigns the admin-ajax URL to a local variable and conditionally appends lang=ICL_LANGUAGE_CODE via add_query_arg() when WPML is present.
Frontend AJAX payload & tooltip safety
assets/js/default-calendar.js
Refactored AJAX payload construction to use a shared ajaxData object that conditionally includes lang from localized vars; wrapped qTip2 tooltip initialization in a try/catch and log warnings on errors.
Documentation formatting-only
CLAUDE.md
Minor formatting edits (shortcode example, trailing whitespace removal, EOF newline) with no semantic content changes.

Sequence Diagram(s)

sequenceDiagram
    participant User
    participant CalendarJS
    participant WP_AJAX
    participant WP_Server

    User->>CalendarJS: navigate / request events
    CalendarJS->>CalendarJS: build ajaxData (include wpml_language.lang if present)
    CalendarJS->>WP_AJAX: POST ajaxData (includes lang when available)
    WP_AJAX->>WP_Server: handle request (respect lang param if provided)
    WP_Server-->>WP_AJAX: return localized events
    WP_AJAX-->>CalendarJS: respond with events
    CalendarJS->>User: render calendar/events
Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

Suggested reviewers

  • Akhill2020
  • enginnk

Poem

🐇
I hop through code with nimble feet,
I pass the language for each seat.
Tooltips wrapped to catch a slip,
Docs tidied up — a tiny fix.
The calendar hums, the events all meet.

✨ Finishing Touches
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch rohit/wpml-event-bubble-issue

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR/Issue comments)

Type @coderabbitai help to get the list of available commands.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

  • You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
  • Please see the configuration documentation for more information.
  • If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Status, Documentation and Community

  • Visit our Status Page to check the current availability of CodeRabbit.
  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@rosinghal rosinghal requested a review from Akhill2020 August 6, 2025 05:41
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
assets/js/default-calendar.js (1)

72-76: Minor: lang is passed in both URL and POST data

You’re appending lang to the AJAX URL in PHP and also including it in POST data here. Redundant but harmless. If you want to reduce duplication, you can omit one (prefer keeping it on the URL for WPML).

Also applies to: 120-124

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 54011aa and b8a73b3.

📒 Files selected for processing (3)
  • CLAUDE.md (2 hunks)
  • assets/js/default-calendar.js (3 hunks)
  • includes/main.php (1 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
  • CLAUDE.md
🧰 Additional context used
📓 Path-based instructions (1)
**/*.php

📄 CodeRabbit Inference Engine (CLAUDE.md)

**/*.php: Ensure code remains compatible with WordPress 4.2 or higher (avoid using WordPress APIs introduced after 4.2 without fallbacks).
Use PHP features compatible with PHP 7.3+ and do not require newer PHP versions.
You may rely on required PHP extensions cURL, iconv, JSON, and mbstring; ensure proper error handling when using them.

Files:

  • includes/main.php
🧬 Code Graph Analysis (1)
assets/js/default-calendar.js (2)
includes/admin/fields/datetime-format.php (2)
  • month (248-276)
  • year (284-304)
includes/browser.php (1)
  • isMobile (241-244)
🪛 Biome (2.1.2)
assets/js/default-calendar.js

[error] 114-114: Shouldn't redeclare 'ajaxData'. Consider to delete it or rename it.

'ajaxData' is defined here:

(lint/suspicious/noRedeclare)

🔇 Additional comments (1)
includes/main.php (1)

277-285: WPML: lang propagation via ajax_url looks good

The conditional add_query_arg using ICL_LANGUAGE_CODE is a safe, backward-compatible way to ensure WPML context on admin-ajax. This should resolve the missing-content issue leading to qTip errors.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (1)
CLAUDE.md (1)

57-57: License line is correct; consider linking and SPDX clarity (nit).

Text matches the required “GPL v2 or later.” For clarity and discoverability, link to the LICENSE file and include the SPDX identifier in code headers.

Suggested tweak:

-This plugin is licensed under the GPL v2 or later.
+This plugin is licensed under the GNU General Public License v2.0 or later (GPL-2.0-or-later). See the [LICENSE](LICENSE) file for details.
📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between b8a73b3 and 8ffe142.

📒 Files selected for processing (1)
  • CLAUDE.md (2 hunks)
🧰 Additional context used
🧠 Learnings (1)
📚 Learning: 2025-08-11T05:36:37.203Z
Learnt from: CR
PR: Xtendify/Simple-Calendar#0
File: CLAUDE.md:0-0
Timestamp: 2025-08-11T05:36:37.203Z
Learning: The plugin is licensed under GPL v2 or later; ensure contributions are compatible with this license.

Applied to files:

  • CLAUDE.md
🔇 Additional comments (3)
CLAUDE.md (3)

19-19: No-op content change.

Appears to be formatting-only; no semantic change.


24-24: Whitespace tidy-up — OK.

Trailing whitespace removal improves diffs and consistency.


16-16: Shortcode registration is correct: both [simple_calendar] and [calendar] are supported

Verification shows in includes/shortcodes.php that both

  • add_shortcode('simple_calendar', …)
  • add_shortcode('calendar', …)

are registered (with gcal as a deprecated alias). The documentation’s use of [simple_calendar] is valid and does not need reverting.

@Akhill2020 Akhill2020 merged commit 877b907 into main Sep 25, 2025
3 checks passed
@Akhill2020 Akhill2020 deleted the rohit/wpml-event-bubble-issue branch September 25, 2025 13:18
Akhill2020 added a commit that referenced this pull request Sep 26, 2025
Akhill2020 added a commit that referenced this pull request Oct 8, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants