Make Astro.request available to all astro components (#960)

* Make Astro.request available to all astro components

* Adds a changeset

7 files changed, 53 insertions, 15 deletions

diff --git a/.changeset/red-falcons-brush.md b/.changeset/red-falcons-brush.md
new file mode 100644
index 000000000..a853e08f7
--- /dev/null
+++ b/.changeset/red-falcons-brush.md
@@ -0,0 +1,5 @@
+---
+'astro': patch
+---
+
+Makes Astro.request available in Astro components
diff --git a/packages/astro/src/compiler/codegen/index.ts b/packages/astro/src/compiler/codegen/index.ts
index b8d6c1f76..e53845720 100644
--- a/packages/astro/src/compiler/codegen/index.ts
+++ b/packages/astro/src/compiler/codegen/index.ts
@@ -163,6 +163,7 @@ function generateAttributes(attrs: Record<string, string>): string {
       result += JSON.stringify(key) + ':' + val + ',';
     }
   }
+  result += `[__astroContext]:props[__astroContext]`;
   return result + '}';
 }
 
@@ -648,7 +649,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile
 
               if (node.type === 'Slot') {
                 state.importStatements.add(`import { __astro_slot } from 'astro/dist/internal/__astro_slot.js';`);
-                buffers[curr] += `h(__astro_slot, ${attributes ? generateAttributes(attributes) : 'null'}, children`;
+                buffers[curr] += `h(__astro_slot, ${generateAttributes(attributes)}, children`;
                 paren++;
                 return;
               }
@@ -661,11 +662,11 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile
                   buffers[curr] += `h(__astro_slot_content, { name: ${attributes.slot} },`;
                   paren++;
                 }
-                buffers[curr] += `h("${name}", ${attributes ? generateAttributes(attributes) : 'null'}`;
+                buffers[curr] += `h("${name}", ${generateAttributes(attributes)}`;
                 paren++;
                 return;
               }
-              const [componentName, componentKind] = name.split(':');
+              const [componentName, _componentKind] = name.split(':');
               let componentInfo = components.get(componentName);
               if (/\./.test(componentName)) {
                 const [componentNamespace] = componentName.split('.');
@@ -691,7 +692,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile
                   buffers[curr] += `h(__astro_slot_content, { name: ${attributes.slot} },`;
                   paren++;
                 }
-                buffers[curr] += `h(${componentName}, ${attributes ? generateAttributes(attributes) : 'null'}`;
+                buffers[curr] += `h(${componentName}, ${generateAttributes(attributes)}`;
                 paren++;
                 return;
               } else if (!componentInfo && !isCustomElementTag(componentName)) {
@@ -705,7 +706,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile
                   if (curr === 'markdown') {
                     await pushMarkdownToBuffer();
                   }
-                  buffers[curr] += `,${componentName}.__render(${attributes ? generateAttributes(attributes) : 'null'}),`;
+                  buffers[curr] += `,${componentName}.__render(${generateAttributes(attributes)}),`;
                 }
                 curr = 'markdown';
                 return;
@@ -726,7 +727,7 @@ async function compileHtml(enterNode: TemplateNode, state: CodegenState, compile
                 paren++;
               }
               paren++;
-              buffers[curr] += `h(${wrapper}, ${attributes ? generateAttributes(attributes) : 'null'}`;
+              buffers[curr] += `h(${wrapper}, ${generateAttributes(attributes)}`;
             } catch (err) {
               paren--;
               // handle errors in scope with filename
diff --git a/packages/astro/src/compiler/index.ts b/packages/astro/src/compiler/index.ts
index 27a3cf994..c7bd98655 100644
--- a/packages/astro/src/compiler/index.ts
+++ b/packages/astro/src/compiler/index.ts
@@ -139,14 +139,26 @@ ${result.createCollection || ''}
 // \`__render()\`: Render the contents of the Astro module.
 import { h, Fragment } from 'astro/dist/internal/h.js';
 const __astroInternal = Symbol('astro.internal');
+const __astroContext = Symbol.for('astro.context');
 async function __render(props, ...children) {
-  const Astro = {
-    ...__TopLevelAstro,
-    props,
-    css: (props[__astroInternal] && props[__astroInternal].css) || [],
-    request: (props[__astroInternal] && props[__astroInternal].request) || {},
-    isPage: (props[__astroInternal] && props[__astroInternal].isPage) || false,
-  };
+  const Astro = Object.create(__TopLevelAstro, {
+    props: {
+      value: props,
+      enumerable: true
+    },
+    css: {
+      value: (props[__astroInternal] && props[__astroInternal].css) || [],
+      enumerable: true
+    },
+    isPage: {
+      value: (props[__astroInternal] && props[__astroInternal].isPage) || false,
+      enumerable: true
+    },
+    request: {
+      value: (props[__astroContext] && props[__astroContext].request) || {},
+      enumerable: true
+    }
+  });
 
   ${result.script}
   return h(Fragment, null, ${result.html});
@@ -163,15 +175,22 @@ export async function __renderPage({request, children, props, css}) {
     __render,
   };
 
+  Object.defineProperty(props, __astroContext, {
+    value: {
+      request
+    },
+    writable: false,
+    enumerable: false
+  });
+
   Object.defineProperty(props, __astroInternal, {
     value: {
-      request,
       css,
       isPage: true
     },
     writable: false,
     enumerable: false
-  })
+  });
 
   const childBodyResult = await currentChild.__render(props, children);
 
diff --git a/packages/astro/test/astro-global.test.js b/packages/astro/test/astro-global.test.js
index 3467cb738..c7a4328a0 100644
--- a/packages/astro/test/astro-global.test.js
+++ b/packages/astro/test/astro-global.test.js
@@ -13,6 +13,8 @@ Global('Astro.request.url', async (context) => {
 
   const $ = doc(result.contents);
   assert.equal($('#pathname').text(), '/');
+  assert.equal($('#child-pathname').text(), '/');
+  assert.equal($('#nested-child-pathname').text(), '/');
 });
 
 Global('Astro.request.canonicalURL', async (context) => {
diff --git a/packages/astro/test/fixtures/astro-global/src/components/Child.astro b/packages/astro/test/fixtures/astro-global/src/components/Child.astro
new file mode 100644
index 000000000..28c84dab2
--- /dev/null
+++ b/packages/astro/test/fixtures/astro-global/src/components/Child.astro
@@ -0,0 +1,5 @@
+---
+import NestedChild from './NestedChild.astro';
+---
+<div id="child-pathname">{Astro.request.url.pathname}</div>
+<NestedChild />
\ No newline at end of file
diff --git a/packages/astro/test/fixtures/astro-global/src/components/NestedChild.astro b/packages/astro/test/fixtures/astro-global/src/components/NestedChild.astro
new file mode 100644
index 000000000..9beea4278
--- /dev/null
+++ b/packages/astro/test/fixtures/astro-global/src/components/NestedChild.astro
@@ -0,0 +1 @@
+<div id="nested-child-pathname">{Astro.request.url.pathname}</div>
\ No newline at end of file
diff --git a/packages/astro/test/fixtures/astro-global/src/pages/index.astro b/packages/astro/test/fixtures/astro-global/src/pages/index.astro
index 511f1bb3e..4906384c4 100644
--- a/packages/astro/test/fixtures/astro-global/src/pages/index.astro
+++ b/packages/astro/test/fixtures/astro-global/src/pages/index.astro
@@ -1,3 +1,6 @@
+---
+import Child from '../components/Child.astro';
+---
 <html>
 <head>
   <title>Test</title>
@@ -6,5 +9,7 @@
 <body>
   <div id="pathname">{Astro.request.url.pathname}</div>
   <a id="site" href={Astro.site}>Home</a>
+
+  <Child />
 </body>
 </html>