Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

full edge runtime support from WCC for edge demo #6

Open
thescientist13 opened this issue May 22, 2022 · 0 comments
Open

full edge runtime support from WCC for edge demo #6

thescientist13 opened this issue May 22, 2022 · 0 comments
Assignees
@thescientist13
Labels
documentation Improvements or additions to documentation enhancement New feature or request

Comments

@thescientist13
Copy link
Owner

thescientist13 commented May 22, 2022 •
edited
Loading

Currently wcc does not yet offer 100% native edge function runtime support, though the DOM shim itself works just fine. This means that although Edge functions are a little more DIY than serverless, it is still possible.

import '../../node_modules/wc-compiler/src/dom-shim.js';

import Footer from './components/footer.js';
import Header from './components/header.js';

export default async function () {
  const footer = new Footer();
  const header = new Header();

  footer.connectedCallback();
  header.connectedCallback();

  const response = new Response(`
    <!DOCTYPE html>
    <html lang='en'>
      <head>
        <meta charset='UTF-8'>
        <meta name='viewport' content='width=device-width, initial-scale=1'>
        <title>WC @ The Edge</title>
      </head>
      <body class='padding-32'>
        <wc-header>
          ${header.getInnerHTML({ includeShadowRoots: true })}
        </wc-header>
        <wc-footer>
          ${footer.getInnerHTML({ includeShadowRoots: true })}
        </wc-footer>
      </body>
    </html>
  `);

  response.headers.set('content-type', 'text/html');

  return response;
}

With wcc supporting this out of the box, we can remove some of the extra boilerplate from the edge demo examples.
@thescientist13 thescientist13 added documentation Improvements or additions to documentation enhancement New feature or request labels May 22, 2022
@thescientist13 thescientist13 self-assigned this May 22, 2022
@thescientist13 thescientist13 changed the title full edge runtime support from **wcc** for edge demo full edge runtime support from WCC for edge demo May 22, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@thescientist13 thescientist13

Labels
documentation Improvements or additions to documentation enhancement New feature or request
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@thescientist13