search

add2cal / add-to-calendar-button

Reliably create beautiful Add to Calendar Buttons, where people can add events to their calendars. Without the hustle and unsupported cases.
https://add-to-calendar-button.com
Other
1.35k stars 111 forks source link

[Bug]: Incomplete parsing of rich text data for iCal/Apple calendar, location text also disappears #614

Closed tinuola closed 1 month ago

tinuola commented 1 month ago

What happened?

When data entered for the description parameter contains rich text/HTML tags, only text in between the first set of tags are stripped and rendered in iCal / Apple calendar. All other rich text is ignored. And content entered for the location parameter is somehow also affected and doesn't display either.

When I manually strip out the tags from the same data, all the content renders as expect and the location as well.

This behavior does not occur in Google or Microsoft 365--the other calendars in my options list.

I've included screenshots below of the behaviors, as well as the sample data used for testing.

Thanks.

How to reproduce?

Data used in the code: Contains two sets of p tags and three new line tags; the first set of p tags is removed; all content after that is ignored and not rendered in the calendar

description: '<p>Admission is free. No advance reservations. Your seat will be assigned to you when you pick up your ticket at the box office. Seats are assigned on a first come, first served basis. The box office opens one hour before the event.</p>\n<p>La Région Centrale</p>\n<p>Canada, 1971</p>\n<The>The late avant-garde master Michael Snow’s work explores the nature of perception, consciousness, participation, and in many ways is uncategorizable but relation to time is evident. He worked in many mediums and his films playfully and prolifically rethink the parameters while requiring audiences to actively participate in this work. La Région Centrale is a three-hour-long film that calls attention to the mechanics of filmmaking, using a computer-programmed, motorized tripod that rotates the camera 360 degrees in any direction, repeatedly, without dialogue or any other subject beyond the landscape, over the course of a day.'

Screenshots & more

When description contains rich text tags, only a portion of the description content is displayed in the calendar; location is not displayed:

01_iCal-event-with-rt-tags_text-cuts-off-no-location

When description contains no rich text tags, all description content is display in the calendar and the location is displayed:

02_iCal-event-no-rt-tags_all-data-displayed

System & Environment

  1. Device and OS: Mac 14.5
  2. Browser: Chrome
  3. Version number of the application: 2.6.18
  4. How you include the script: Vue3 application, npm install
jekuer commented 1 month ago

Hi @tinuola ,

This is because we do not support any tags. That the first paragraph seems to work is more of an coincidence. Have a look at the documentation at https://add-to-calendar-button.com/configuration#description - you can use pseudo HTML for this case.

Or check our PRO offering, which makes things way easier and also way more stable (as ics files get built on the server side and stuff).

Go Bruins!