Option to Ignore XML Directives

[Sean Moran]

✏️ Briefly describe the issue you are experiencing (or the feature you want to see added to the plugin). Tell us what you were trying to do and what happened instead. Remember, this is not a place to ask questions. For that, go to http://gitter.im/posthtml/posthtml

Details

✏️ Describe in more detail the problem you have been experiencing, if necessary.

I'm trying to use PHP tags inside my HTML. I was surprised to learn that the classic PHP tag, <?php ?>, is an XML directive. PostHTML doesn't seem to output XML directives. I'm not sure how it uses them.

Sometimes I'm able to output the XML directives, but in these cases they're still not output if I use locals with something like posthtml-expressions or posthtml-pug. They don't work in locals in either pug's unescaped buffered code or piped text, either, though they work in these situations in Pug itself. Directives always work inside attributes and <script> tags, I assume because they are not used as directives here.

Is there any way to use XML directives verbatim in the HTML, or at least the PHP directives, as well as inside locals, either through something like escaping or through a configuration option? Why/how are they even used? Should there maybe be an option to not parse as XML in the first place?

I might be able to send a pull request, if someone points me in the right direction, though I may take a little while as I have work all week.

Error (Logs|Stacks)

👉 Create a gist which is a paste of your full logs, and link them here.

⚠️ Do not paste your full logs here (or at least hide them by using a <details></details> block), as it will make this issue long and hard to read! If you are reporting a bug, always include logs!

Reproduction (Code)

⚠️ Please remember that, with sample code; it's easier to reproduce a bug and much faster to fix it.

I didn't add every single case I tried, notably with Pug & SugarML, but I tried to cover all the base cases. If you need more, or would like some Pug/SugarML cases, please let me know.

const posthtml = require('posthtml');
const Expressions = require('posthtml-expressions');

const expressions = Expressions({locals: {phpVar: '<?php echo $myVar ?>'}});

const text = '<?php echo $myText; ?>';
const propertyText = '<?php echo $myVar->text; ?>';
const attribute = '<input value="<php echo $myDefaultValue; ?>" />';
const script = '<script><php echo $myVarDeclaration; ?>" /></script>';
const localsText = '{{{phpVar}}}';

const {html: textHtml} = posthtml().process(text, {sync: true});
const {html: propertyTextHtml} = posthtml().process(propertyText, {sync: true});
const {html: attributeHtml} = posthtml().process(attribute, {sync: true});
const {html: scriptHtml} = posthtml().process(script, {sync: true});
const {html: localsTextHtml} = posthtml([expressions]).process(localsText, {sync: true});

console.log(`"${textHtml}"`); // ""
console.log(`"${propertyTextHtml}"`); // "text; ?>"
console.log(`"${attributeHtml}"`); // "<input value="<php echo $myDefaultValue; ?>">"
console.log(`"${scriptHtml}"`); // "<script><php echo $myVarDeclaration; ?>" /></script>"
console.log(`"${localsTextHtml}"`); // ""

🔗 Please refer to a simple code example.

$ git clone https://github.com/<user>/<sample>

Environment

ℹ️ Please provide information about your current environment.

OS	node	npm/yarn	package
[name][version]	[version]	[version]	[version]

OS: Ubuntu 20.04, CentOS 7
node-v: v14.4.0
npm -v: 6.14.6

[Ivan Demidov]

@trisys3 Hi, thanks for the feedback and I'm sorry that I didn't notice your message in gitter. I will try to sort out your question as soon as possible.

With a cursory reading of your problem, as far as I was able to understand you are experiencing problems using directives from PHP. They should work because tests are passed on them.

https://github.com/posthtml/posthtml-parser/blob/241a34377c7e6f43e78a0ec39d31c3279c737966/test/test.js#L126-L169

Perhaps you did not explicitly specify the type of directive you are using in the options

import posthtml from 'posthtml'

const php = `
  <component>
    <title><?php echo $title; ?></title>
    <text><?php echo $article; ?></text>
  </component>
`

const result = posthtml()
  .use(require('posthtml-custom-elements')())
  .process(html, {
    directives: [
      { name: '?php', start: '<', end: '>' }
    ]
  })
  .html

console.log(result)

[Sean Moran]

That's fine, you were a lot faster than most issue answerers I've worked with. I haven't used gitter actually, is that the way you like to communicate on this repo?

I don't see directives as an option for posthtml.process. According to the API page for PostHTML, there are 4 options: sync, parser, render & skipParse. What does directives do, and where is it documented?

[Sean Moran]

I found the docs for directives, under the repo for parser. I didn't see any place that mentioned these options are used in the process function.

The directives option is a little confusing, too. Does this actually make the parser ignore the directive? What does the parser do otherwise, with directives that aren't ignored?

If this is what I'm meant to do, then I guess I'll close the issue, though I still think the docs are a bit confusing.

[Ivan Demidov]

I found the docs for directives, under the repo for parser. I didn't see any place that mentioned these options are used in the process function.

https://posthtml.org/#/usage?id=api / https://github.com/posthtml/posthtml#api
under the description about async

The directives option is a little confusing, too. Does this actually make the parser ignore the directive?

yes

What does the parser do otherwise, with directives that aren't ignored?

Attempts to parse them, the parser should not know about third-party directives unless explicitly specified in the options

[Sean Moran]

I posted this in the gitter, but no one responded yet: How would I set the directive(s) in the webpack loader?

[Ivan Demidov]

I posted this in the gitter, but no one responded yet:

Hi, github is now the preferred and faster way to communicate.

How would I set the directive(s) in the webpack loader?

Apparently this functionality is not implemented in posthtml-loader

[Sean Moran]

That was fast, less than 2 weeks ago you recommended using gitter, in this same issue no less.

I noticed you opened another issue on posthtml-loader, thanks. I'm sure you already saw this, but I added a comment with more details about what I'm trying to do.

[Ivan Demidov]

That was fast, less than 2 weeks ago you recommended using gitter, in this same issue no less.

Yes, I try to quickly adapt to the situation and I see that I won't be able to pull another messenger and it's not effective for me. So I came to the conclusion that github is a convenient way for me to understand and solve the problem and everything in one place)

I noticed you opened another issue on posthtml-loader, thanks. I'm sure you already saw this, but I added a comment with more details about what I'm trying to do.

Thank you, it was important for the prompt solution of the problem