diff --git a/app/assets/javascripts/discourse/widgets/widget.js.es6 b/app/assets/javascripts/discourse/widgets/widget.js.es6
index 339549c3b4e..b57049c695f 100644
--- a/app/assets/javascripts/discourse/widgets/widget.js.es6
+++ b/app/assets/javascripts/discourse/widgets/widget.js.es6
@@ -91,6 +91,8 @@ function drawWidget(builder, attrs, state) {
     }
   }
 
+  this.transformed = this.transform();
+
   let contents = this.html(attrs, state);
   if (this.name) {
     const beforeContents = applyDecorators(this, 'before', attrs, state) || [];
@@ -173,6 +175,10 @@ export default class Widget {
     }
   }
 
+  transform() {
+    return {};
+  }
+
   defaultState() {
     return {};
   }
diff --git a/lib/javascripts/widget-hbs-compiler.js.es6 b/lib/javascripts/widget-hbs-compiler.js.es6
index 8b3a20be962..7e756f37461 100644
--- a/lib/javascripts/widget-hbs-compiler.js.es6
+++ b/lib/javascripts/widget-hbs-compiler.js.es6
@@ -1,5 +1,5 @@
 function resolve(path) {
-  if (path.indexOf('settings') === 0) {
+  if (path.indexOf('settings') === 0 || path.indexOf('transformed') === 0) {
     return `this.${path}`;
   }
   return path;
@@ -29,6 +29,8 @@ function argValue(arg) {
     return sexp(arg.value);
   } else if (value.type === "PathExpression") {
     return value.original;
+  } else if (value.type === "StringLiteral") {
+    return JSON.stringify(value.value);
   }
 }
 
@@ -37,13 +39,13 @@ function mustacheValue(node, state) {
 
   switch(path) {
     case 'attach':
-      let widgetName = node.hash.pairs.find(p => p.key === "widget").value.value;
+      let widgetName = argValue(node.hash.pairs.find(p => p.key === "widget"));
 
       let attrs = node.hash.pairs.find(p => p.key === "attrs");
       if (attrs) {
-        return `this.attach("${widgetName}", ${argValue(attrs)})`;
+        return `this.attach(${widgetName}, ${argValue(attrs)})`;
       }
-      return `this.attach("${widgetName}", attrs)`;
+      return `this.attach(${widgetName}, attrs)`;
 
       break;
     case 'yield':
@@ -54,7 +56,7 @@ function mustacheValue(node, state) {
       if (node.params[0].type === "StringLiteral") {
         value = `"${node.params[0].value}"`;
       } else if (node.params[0].type === "PathExpression") {
-        value = node.params[0].original;
+        value = resolve(node.params[0].original);
       }
 
       if (value) {
@@ -146,7 +148,7 @@ class Compiler {
           case 'unless':
             negate = '!';
           case 'if':
-            instructions.push(`if (${negate}${node.params[0].original}) {`);
+            instructions.push(`if (${negate}${resolve(node.params[0].original)}) {`);
             node.program.body.forEach(child => {
               instructions = instructions.concat(this.processNode(parentAcc, child));
             });
@@ -160,7 +162,7 @@ class Compiler {
             instructions.push(`}`);
             break;
           case 'each':
-            const collection = node.params[0].original;
+            const collection = resolve(node.params[0].original);
             instructions.push(`if (${collection} && ${collection}.length) {`);
             instructions.push(`  ${collection}.forEach(${node.program.blockParams[0]} => {`);
             node.program.body.forEach(child => {
diff --git a/script/test_hbs_compiler.rb b/script/test_hbs_compiler.rb
index 9bfe595261a..0045b942545 100644
--- a/script/test_hbs_compiler.rb
+++ b/script/test_hbs_compiler.rb
@@ -5,7 +5,13 @@ template = <<~HBS
   {{#if state.category}}
     {{attach widget="category-display" attrs=(hash category=state.category someNumber=123 someString="wat")}}
   {{/if}}
-  {{#unless state.hello}}
+  {{#each transformed.something as |s|}}
+    {{s.wat}}
+  {{/each}}
+
+  {{attach widget=settings.widgetName}}
+
+  {{#unless settings.hello}}
     XYZ
   {{/unless}}
 HBS