Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Plugin conflict: The Events Calendar #2284

Open
pixelasticity opened this issue Apr 5, 2024 · 4 comments
Open

Plugin conflict: The Events Calendar #2284

pixelasticity opened this issue Apr 5, 2024 · 4 comments
Labels
🪲 Bug Something isn't working. Frontend (Style) Related to the client-side CSS (or Sass) Plugin / Library / API For third-party resources such as WordPress plugins, external APIs, and other libraries. 💭 Question / Research Additional research/discussion is needed to answer this question.
Milestone

Comments

@pixelasticity
Copy link

Version information can be found in the lower right of most WP admin screens
WordPress Version: 6.5
Nebula Version: 11.8.10.395

Describe the Problem
There seems to be a plugin conflict between Nebula and The Events Calendar that causes the calendar to only ever display the mobile version.

Steps to Reproduce

  1. Install Nebula and activate theme (or child theme if you prefer)
  2. Install and activate The Events Calendar
  3. View the monthly calendar in various browser sizes

Expected Behavior
The plugin should be able to switch to desktop view on larger screens.

Additional Information
Strangely, the problem doesn't seem to happen if you're logged in to WordPress.

@pixelasticity pixelasticity added the 🪲 Bug Something isn't working. label Apr 5, 2024
@chrisblakley chrisblakley added the Plugin / Library / API For third-party resources such as WordPress plugins, external APIs, and other libraries. label Apr 6, 2024
@chrisblakley chrisblakley added this to the 12.0 Flame milestone Apr 6, 2024
@chrisblakley
Copy link
Owner

I took a peek at this tonight, but I don't seem to be able to reproduce the issue you're seeing.

This is the plugin I tested with: https://wordpress.org/plugins/the-events-calendar/

When I scale the window narrower and wider it seems to respond appropriately, but let me know if there are any more specifics to try to reproduce the issue– I tried in a few browsers. I did also try logged in and logged out as well as going extra wide.

Screen.Recording.2024-04-05.at.10.54.02.PM.mov

If you are familiar with the browser inspector, if you can provide any additional context related to the classes/CSS that may be conflicting that can also help narrow this down.

Also, any screenshots you can provide would also be great– is the entire monthly calendar disappearing or only partially?

@chrisblakley chrisblakley added 💭 Question / Research Additional research/discussion is needed to answer this question. Frontend (Style) Related to the client-side CSS (or Sass) labels Apr 6, 2024
@pixelasticity
Copy link
Author

Hey there,

Thanks so much for looking into this issue.

The calendar isn't disappearing at all, it just stays in the mobile version at all times unless I'm logged in, in which case it doesn't have any issues.
Screenshot 2024-04-24 at 2 39 27 PM

I know The Events Calendar uses a function to change the calendar from one version to another (as opposed to CSS), but I don't get any errors in the console or anywhere. I thought it was my child theme, but if I make Nebula the active theme, it still doesn't work, and if I change the theme to a default one, it does work.

@chrisblakley
Copy link
Owner

Thanks for the clarification– can you also provide a screenshot of what it should look like at desktop size? I can look around myself as well, but if you happen to have that as a reference that would be great, thanks.

Also, you mentioned it may use a JavaScript function to trigger the swap– any chance you know that function name? I can see if there are any conflicts in there too.

@chrisblakley chrisblakley modified the milestones: 12.0 Flame, 13.0 Bubble May 1, 2024
@pixelasticity
Copy link
Author

Please ignore the colors as I customized the CSS a bit, however, you can see that in the mobile view, it shows the date in m/d/yyyy format at the top, whereas in desktop view, it shows previous and next buttons, a "this month" button, and the name of the current month above the calendar. The mobile view also has single letters for the days of the week instead of three-letter abbreviations.

Mobile

Screenshot 2024-05-02 at 10 34 26 AM

Desktop

Screenshot 2024-05-02 at 10 35 06 AM

As for the function, I don't know the name of the one that does the swap, but there's a function called initBreakpoints() that's involved in the process. Inside that function, it's supposed to run window.tribe.events.views.breakpoints.setup( container );, which doesn't happen when you aren't logged in.

So I looked into that, and the Events Calendar JavaScript file isn't loading for non-logged-in users. All the CSS files from the plugin are loading perfectly fine, however.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🪲 Bug Something isn't working. Frontend (Style) Related to the client-side CSS (or Sass) Plugin / Library / API For third-party resources such as WordPress plugins, external APIs, and other libraries. 💭 Question / Research Additional research/discussion is needed to answer this question.
Projects
None yet
Development

No branches or pull requests

2 participants