fix(pencil): Attribute support

src/index.js

@@ -77,7 +77,9 @@ const loadTemplate = async (file, context = {}, namespaces) => {
   return Twig.twigAsync({
     path: file,
   }).then((template) => {
-    context.attributes = new DrupalAttribute()
+    if (!context.hasOwnProperty("attributes")) {
+      context.attributes = new DrupalAttribute()
+    }
     return template.render(context)
   })
 }

tests/fixtures/accordion.twig

@@ -1,4 +1,4 @@
-<details class="accordion" {% if open %}open{% endif %}>
+<details {{ attributes.addClass('accordion') }} {% if open %}open{% endif %}>
   <summary class="accordion__title">{{ title|default('Accordion title')|backwords }}</summary>
   <div class="accordion__content">
     {% block accordion_content %}

tests/index.js

@@ -1,6 +1,7 @@
 /* eslint no-new: 0 */
 import Accordion from './fixtures/accordion';
 import {render, fireEvent, Twig} from "../src";
+import DrupalAttribute from "drupal-attribute"
 
 Twig.extendFilter("backwords", (text) => {
   return text.split(" ").reverse().join(" ");
@@ -58,4 +59,19 @@ describe('Test library by testing an accordion', () => {
     expect(summaryElement.getAttribute('aria-expanded')).toEqual('false');
     expect(summaryElement.getAttribute('aria-pressed')).toEqual('false');
   });
+
+  it('Can support passing attributes', async () => {
+    const attributes = new DrupalAttribute()
+    attributes.set('data-foo', 'bar')
+    const { container, getByText } = await render('./tests/fixtures/accordion.twig', {
+      // This is intentionally backwards so we can test extending twig.
+      title: 'title Accordion',
+      open: false,
+      attributes
+    }, {
+      'twig-testing-library-tests': './tests/fixtures/'
+    });
+    const accordionElement = container.querySelector('.accordion');
+    expect(accordionElement.dataset.foo).toEqual('bar');
+  });
 });