search

Karmalakas / grav-plugin-photoswipe

Add Photoswipe gallery to your pages
MIT License
8 stars 1 forks source link

Usage of DOMDocument destroys DOM #10

Open LiaraAlis opened 1 year ago

LiaraAlis commented 1 year ago

The usage of the DOMDocument object can destroy the DOM and make usage of AlpineJS with @click impossible on pages with a gallery. Example:

    <button @click.prevent="isOpen = !isOpen" class="toggle" title="Menü">
        <i class="fa-solid fa-bars"></i>
    </button>

will be saved to:

    <button class="toggle" title="Menü">
        <i class="fa-solid fa-bars"></i>
    </button>

Because of that, this button is no longer working.

This is a workaround:

    <button x-on:click.prevent="isOpen = !isOpen" class="toggle" title="Menü">
        <i class="fa-solid fa-bars"></i>
    </button>

Isn't there a other option to add the code? I suggest to prevent usage of this class because I experienced a lot of problems using this class.

Karmalakas commented 1 year ago

I think I might've found a solution, but I need to do more research if this approach wouldn't break something. Or I'll need to add additional flag to options for htmlspecialchars_decode() 😕 But I can't just not use DOMDocument if I want to make implementation easy

<?php
$holder = <<<TPL
    <button @attribute="isOpen" class="toggle" title="Menu">
        <i class="fa-solid fa-bars"></i>
    </button>
TPL;

$doc = new DOMDocument();
$doc->loadHTML('<body></body>');

$body = $doc->getElementsByTagName('body')->item(0);
$template = $doc->createTextNode($holder);

$body->appendChild($template);

var_dump(htmlspecialchars_decode($doc->saveHTML()));

Unfortunately ATM I have my hands full, so it might be a while until I get to this 🙁