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

Web Component Safari fixes #2578

Merged

Conversation

sascha-karnatz
Copy link
Contributor

@sascha-karnatz sascha-karnatz commented Sep 13, 2023

What is this pull request for?

  • extend the base web component class
  • update the alchemy-datepicker component to be compatible with Safari
  • update the alchemy-tinymce component to be compatible with Safari

Notable changes

  • Instead of <input is="alchemy-datepicker" ...> use <alchemy-datepicker><input .../></alchemy-datepicker>
  • Instead of <textarea is="alchemy-tinymce" ...></textarea> use <alchemy-tinymce><textarea id="..." ...></textarea></alchemy-tinymce>

Checklist

  • I have followed Pull Request guidelines
  • I have added a detailed description into each commit message
  • I have added tests to cover this change

@sascha-karnatz sascha-karnatz marked this pull request as draft September 13, 2023 09:59
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/safari-fixes branch 4 times, most recently from 055eb6b to 8175f41 Compare September 13, 2023 19:25
@sascha-karnatz sascha-karnatz requested a review from a team September 13, 2023 19:25
@sascha-karnatz sascha-karnatz marked this pull request as ready for review September 13, 2023 19:25
Added a test for AlchemyHTMLElement and test the main functions. Extended this web component base class to proper rerender and use the initial content. Also start with a new component helper to collect offen used utility methods.
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/safari-fixes branch from 8175f41 to 9f9de2a Compare September 14, 2023 07:52
Instead of extending a HTMLElement create a proper tag that can also be handled by Safari. Add a smaller Jest test to test the basic setup. Update the Alchemy helper to render the datepicker in the new format.
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/safari-fixes branch 4 times, most recently from 4553ece to b1a1f92 Compare September 14, 2023 19:29
Safari does not support the defined extend syntax and therefor only custom tags can be used. Also a bunch of test for the tinymce are now in place.
It is way easier to use without the relative paths and it allows imports in the class you are going to test.
@sascha-karnatz sascha-karnatz force-pushed the update_javascript/safari-fixes branch 2 times, most recently from bba133c to cbd402a Compare September 15, 2023 11:46
let component = undefined

beforeEach(() => {
const html = `<input type="text" is="alchemy-tooltip">`
Copy link
Member

Choose a reason for hiding this comment

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

<alchemy-tooltip name="" value="" />

@tvdeyen tvdeyen merged commit 6efd2da into AlchemyCMS:main Sep 15, 2023
@sascha-karnatz sascha-karnatz deleted the update_javascript/safari-fixes branch September 15, 2023 12:22
@tvdeyen tvdeyen added this to the 7.1 milestone Sep 15, 2023
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.

2 participants