better docs and add input to component

Author: danielcondemarin

README.md

@@ -430,6 +430,7 @@ The fourth cache behaviour handles next API requests `api/*`.
 | useServerlessTraceTarget | `boolean`         | `false`                                                                                                                    | Use the experimental-serverless-trace target to build your next app. This is the same build target that Vercel Now uses. See this [RFC](https://github.com/vercel/next.js/pull/8246) for details.                                                                                                                                                                                |
 | logLambdaExecutionTimes  | `boolean`         | `false`                                                                                                                    | Logs to CloudWatch the default handler performance metrics.                                                                                                                                                                                                                                                                                                                      |
 | minifyHandlers           | `boolean`         | `false`                                                                                                                    | Use minified handlers to reduce code size.                                                                                                                                                                                                                                                                                                                                       |
+| enableHTTPCompression    | `boolean`         | `false`                                                                                                                    | When set to `true` the Lambda@Edge functions for SSR and API requests will use Gzip to compress the response. Note that you shouldn't need to enable this because CloudFront will compress responses for you out of the box.                                                                                                                                                     |
 
 Custom inputs can be configured like this:
 

packages/compat-layers/lambda-at-edge-compat/README.md

@@ -27,6 +27,6 @@ module.exports.render = async (event, context) => {
 
 ```js
 const { req, res, responsePromise } = cloudFrontCompat(event.Records[0].cf, {
-  enableHTTPCompresssion: true // false by default
+  enableHTTPCompression: true // false by default
 });
 ```

packages/compat-layers/lambda-at-edge-compat/__tests__/next-aws-cloudfront.response.test.js

@@ -371,11 +371,10 @@ describe("Response Tests", () => {
     });
   });
 
-  it(`gzips`, () => {
-    expect.assertions(2);
+  it("does not gzip by default", () => {
+    expect.assertions(3);
 
     const gzipSpy = jest.spyOn(zlib, "gzipSync");
-    gzipSpy.mockReturnValueOnce(Buffer.from("ok-gzipped"));
 
     const { res, responsePromise } = create({
       request: {
@@ -393,6 +392,40 @@ describe("Response Tests", () => {
 
     res.end("ok");
 
+    return responsePromise.then((response) => {
+      expect(gzipSpy).not.toBeCalled();
+      expect(response.headers["content-encoding"]).not.toBeDefined();
+      expect(response.body).toEqual("b2s=");
+    });
+  });
+
+  it(`gzips when compression is enabled`, () => {
+    expect.assertions(2);
+
+    const gzipSpy = jest.spyOn(zlib, "gzipSync");
+    gzipSpy.mockReturnValueOnce(Buffer.from("ok-gzipped"));
+
+    const { res, responsePromise } = create(
+      {
+        request: {
+          path: "/",
+          headers: {
+            "accept-encoding": [
+              {
+                key: "Accept-Encoding",
+                value: "gzip"
+              }
+            ]
+          }
+        }
+      },
+      {
+        enableHTTPCompression: true
+      }
+    );
+
+    res.end("ok");
+
     gzipSpy.mockRestore();
 
     return responsePromise.then((response) => {

packages/compat-layers/lambda-at-edge-compat/next-aws-cloudfront.js

@@ -144,7 +144,11 @@ const isGzipSupported = (headers) => {
   return gz;
 };
 
-const handler = (event, { enableHTTPCompression }) => {
+const defaultOptions = {
+  enableHTTPCompression: false
+};
+
+const handler = (event, { enableHTTPCompression } = defaultOptions) => {
   const { request: cfRequest, response: cfResponse = { headers: {} } } = event;
 
   const response = {

packages/serverless-components/nextjs-component/src/component.ts

@@ -188,7 +188,7 @@ class NextjsComponent extends Component {
           logLambdaExecutionTimes: inputs.logLambdaExecutionTimes || false,
           domainRedirects: inputs.domainRedirects || {},
           minifyHandlers: inputs.minifyHandlers || false,
-          enableHTTPCompression: false
+          enableHTTPCompression: inputs.enableHTTPCompression || false
         }
       );
 

packages/serverless-components/nextjs-component/types.d.ts

@@ -20,6 +20,7 @@ export type ServerlessComponentInputs = {
   domainRedirects?: { [key: string]: string };
   cloudfront?: CloudfrontOptions;
   minifyHandlers?: boolean;
+  enableHTTPCompression?: boolean;
 };
 
 type CloudfrontOptions = Record<string, any>;