why are Twig template variables with markup not being rendered?

Question

In my template preprocess function I have a variable:

$test = "<p>this is a paragraph</p>";

and I pass it to my template:

$variables['test'] = $test;

and output it in twig:

{{test}}

but instead of getting a formatted paragraph, I'm getting the original output in plain text:

<p>this is a paragraph</p>

How do I get Drupal to render this as normal HTML?

Answer 1

Because twig auto-escapes unsafe content and your content isn't marked as safe.

You can explicitly tell it that it is with $test = Markup::create($test); but you should be very careful with that. If it contains any sort of user input, you might open yourself for XSS issues.

Better approaches are using a render array like ['#markup' => 'your text'] which by default will allow a certain amount of html tags but not all of them. You can also use an inline template as documented here: https://www.drupal.org/node/2311123.

Twig natively understands render arrays, so it doesn't matter for your template if you provide a render array or a string.

Answer 2

These are two possibilities to wrap $test in a paragraph and pass it to the twig template:

$variables['test'] = [
  '#markup' => $test,
  '#prefix' => '<p>',
  '#suffix' => '</p>',
];

$variables['test'] = [
  '#type' => 'inline_template',
  '#template' => '<p>{{ text }}</p>',
  '#context' => [
    'text' => $test,
  ],
];