11ty / webc

Single File Web Components
MIT License
1.33k stars 39 forks source link

XML rendering in WebC #102

Open pepelsbey opened 1 year ago

pepelsbey commented 1 year ago

I’ve been using Eleventy to generate different files, from iCal to RSS. I talk about permalinks in another issue, but I’d like to address XML here. It seems like the parser behind WebC is HTML-only by design, which is not a problem for the main use case. But still :)

You can checkout the sample barebone project or use these steps to reproduce.

Steps to reproduce

1. Set up a sample project:

mkdir webc-xml
cd webc-xml
npm init -y
npm i --save-dev @11ty/eleventy@v2.0.0-canary.31 @11ty/eleventy-plugin-webc

2. Create eleventy.config.js with the following content:

const webc = require('@11ty/eleventy-plugin-webc');

module.exports = (config) => {
    config.addPlugin(webc);
};

3. Create svg.webc with the following content

<?xml version="1.0" encoding="utf-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 100">
    <style>
        path {
            fill: tomato;
        }
    </style>
    <path d="M0 0h50v100L25 80 0 100"/>
</svg>

4. Create xml.webc with the following content

<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:base="https://example.com">
    <title>Title</title>
    <entry>
        <title>Entry</title>
        <link href="https://example.com"/>
        <content type="html" xml:lang="en">
            <![CDATA[
                11
            ]]>
        </content>
    </entry>
</feed>

5. Run npx @11ty/eleventy

Expected behavior

More or less intact, or functionally similar output in both cases:

I know, these files are HTML, but I was hoping to generate XML documents with WebC, too.

Actual behavior

In XML case:

<!--?xml version="1.0" encoding="utf-8"?-->
<feed xmlns="http://www.w3.org/2005/Atom" xml:base="https://example.com">
    <title>Title</title>
    <entry>
        <title>Entry</title>
        <link href="https://example.com">
        <content type="html" xml:lang="en">
            <!--[CDATA[
                11
            ]]-->
        </content>
    </entry>
</feed>

In SVG case:

<!--?xml version="1.0" encoding="utf-8"?-->
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 100">
    <path fill="#c00" d="M0 0h50v100L25 80 0 100"></path>

</svg>
zachleat commented 1 year ago

Ooh, I think this is likely something that would need to be contributed/pull requested