Sanitize PHP heredoc syntax #2825

Florian418 · 2024-09-02T13:43:25Z

Florian418
Sep 2, 2024

Hi,
I'm trying to 'clone' Raw HTML Tool plugin, to render PHP code blocks.
However, when I try to write some PHP using the Heredoc syntax the content get sanitized with HTML rules, so:

$html=<<<HTML
  <h1>PHP heredoc syntax</h1
HTML;

Turn into:

$html=&lt;&lt;HTML CODE
HTML;

I guess the sanitize rules don't allow "<<<".
I read the documentation about the sanitizer but I have no clue if I can implement a sanitzer rules configuration to 'accept' PHP headoc syntax.

Do you think it's possible?
I might need to remove the automatic sanitizer and add a sanitizerConfig, but I'm not sure. Do you have any advice?

Apologies for my beginner level, and thank you for your help.

/**
 * Build styles
 */
import './index.css';

import { IconBrackets } from '@codexteam/icons';

/**
 * Raw HTML Tool for CodeX Editor
 *
 * @author CodeX (team@codex.so)
 * @copyright CodeX 2018
 * @license The MIT License (MIT)
 */

/**
 * Try to 'clone' Raw HTML Tool for PHP language
 */
export default class RawPhp{
    /**
     * Notify core that read-only mode is supported
     *
     * @returns {boolean}
     */
    static get isReadOnlySupported() {
      return true;
    }
  
    /**
     * Should this tool be displayed at the Editor's Toolbox
     *
     * @returns {boolean}
     * @public
     */
    static get displayInToolbox() {
      return true;
    }
  
    /**
     * Allow to press Enter inside the RawTool textarea
     *
     * @returns {boolean}
     * @public
     */
    static get enableLineBreaks() {
      return true;
    }
  
    /**
     * Get Tool toolbox settings
     * icon - Tool icon's SVG
     * title - title to show in toolbox
     *
     * @returns {{icon: string, title: string}}
     */
    static get toolbox() {
      return {
        icon: IconBrackets,
        title: 'Raw PHP',
      };
    }
  
    /**
     * @typedef {object} RawData — plugin saved data
     * @param {string} php - previously saved HTML code
     * @property
     */
  
    /**
     * Render plugin`s main Element and fill it with saved data
     *
     * @param {RawData} data — previously saved PHP data
     * @param {object} config - user config for Tool
     * @param {object} api - CodeX Editor API
     * @param {boolean} readOnly - read-only mode flag
     */
    constructor({ data, config, api, readOnly }) {
      this.api = api;
      this.readOnly = readOnly;
  
      this.placeholder = config.placeholder || RawPhp.DEFAULT_PLACEHOLDER;
  
      this.CSS = {
        baseClass: this.api.styles.block,
        input: this.api.styles.input,
        wrapper: 'ce-rawtool',
        textarea: 'ce-rawtool__textarea',
      };
  
      this.data = {
        php: data.php || '',
      };
  
      this.textarea = null;
      this.resizeDebounce = null;
    }
  
    /**
     * Return Tool's view
     *
     * @returns {HTMLDivElement} this.element - RawTool's wrapper
     * @public
     */
    render() {
      const wrapper = document.createElement('div');
      const renderingTime = 100;
  
      this.textarea = document.createElement('textarea');
  
      wrapper.classList.add(this.CSS.baseClass, this.CSS.wrapper);
  
      this.textarea.classList.add(this.CSS.textarea, this.CSS.input);
      this.textarea.textContent = this.data.php;
      this.textarea.placeholder = this.placeholder;
  
      if (this.readOnly) {
        this.textarea.disabled = true;
      } else {
        this.textarea.addEventListener('input', () => {
          this.onInput();
        });
      }
  
      wrapper.appendChild(this.textarea);
  
      setTimeout(() => {
        this.resize();
      }, renderingTime);
  
      return wrapper;
    }
  
    /**
     * Extract Tool's data from the view
     * 
     * 
     *
     * @param {HTMLDivElement} rawToolsWrapper - RawTool's wrapper, containing textarea with raw HTML code
     * @returns {RawData} - raw HTML code
     * @public
     */
    save(rawToolsWrapper) {
      return {
        php: rawToolsWrapper.querySelector('textarea').value,
      };
    }
  
    /**
     * Default placeholder for RawTool's textarea
     *
     * @public
     * @returns {string}
     */
    static get DEFAULT_PLACEHOLDER() {
      return 'Enter PHP code';
    }
  
    /**
     * Automatic sanitize config
     * I need to change the rule here?
     */
    static get sanitize() {
      return {
        html: true, // Allow HTML tags
      };
    }
  
    /**
     * Textarea change event
     *
     * @returns {void}
     */
    onInput() {
      if (this.resizeDebounce) {
        clearTimeout(this.resizeDebounce);
      }
  
      this.resizeDebounce = setTimeout(() => {
        this.resize();
      }, 200);
    }
  
    /**
     * Resize textarea to fit whole height
     *
     * @returns {void}
     */
    resize() {
      this.textarea.style.height = 'auto';
      this.textarea.style.height = this.textarea.scrollHeight + 'px';
    }
  }

Florian418 · 2024-11-12T10:01:36Z

Florian418
Nov 12, 2024
Author

I will find another solution.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

Sanitize PHP heredoc syntax #2825

Uh oh!

{{title}}

Uh oh!

Replies: 1 comment

Uh oh!

{{title}}

Uh oh!

Select a reply

Uh oh!

Uh oh!

Sanitize PHP heredoc syntax #2825

Uh oh!

Florian418 Sep 2, 2024

Replies: 1 comment

Uh oh!

Florian418 Nov 12, 2024 Author

Florian418
Sep 2, 2024

Florian418
Nov 12, 2024
Author