Skip to content

Commit

Permalink
Revert "Fixes using React.lazy and Suspense"
Browse files Browse the repository at this point in the history
This reverts commit 700d4f9.
  • Loading branch information
matthewp committed Apr 20, 2022
1 parent 700d4f9 commit e621c2f
Show file tree
Hide file tree
Showing 20 changed files with 14 additions and 186 deletions.

This file was deleted.

This file was deleted.

This file was deleted.

19 changes: 6 additions & 13 deletions packages/astro/test/react-component.test.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { expect } from 'chai';
import { load as cheerioLoad } from 'cheerio';
import cheerio from 'cheerio';
import { isWindows, loadFixture } from './test-utils.js';

let fixture;
Expand All @@ -18,7 +18,7 @@ describe('React Components', () => {

it('Can load React', async () => {
const html = await fixture.readFile('/index.html');
const $ = cheerioLoad(html);
const $ = cheerio.load(html);

// test 1: basic component renders
expect($('#react-static').text()).to.equal('Hello static!');
Expand Down Expand Up @@ -51,13 +51,13 @@ describe('React Components', () => {

it('Can load Vue', async () => {
const html = await fixture.readFile('/index.html');
const $ = cheerioLoad(html);
const $ = cheerio.load(html);
expect($('#vue-h2').text()).to.equal('Hasta la vista, baby');
});

it('Can use a pragma comment', async () => {
const html = await fixture.readFile('/pragma-comment/index.html');
const $ = cheerioLoad(html);
const $ = cheerio.load(html);

// test 1: rendered the PragmaComment component
expect($('.pragma-comment')).to.have.lengthOf(2);
Expand All @@ -66,7 +66,7 @@ describe('React Components', () => {
// TODO: is this still a relevant test?
it.skip('Includes reactroot on hydrating components', async () => {
const html = await fixture.readFile('/index.html');
const $ = cheerioLoad(html);
const $ = cheerio.load(html);

const div = $('#research');

Expand All @@ -76,13 +76,6 @@ describe('React Components', () => {
// test 2: renders correctly
expect(div.html()).to.equal('foo bar <!-- -->1');
});

it('Can load Suspense-using components', async () => {
const html = await fixture.readFile('/suspense/index.html');
const $ = cheerioLoad(html);
expect($('#client #lazy')).to.have.lengthOf(1);
expect($('#server #lazy')).to.have.lengthOf(1);
});
});

if (isWindows) return;
Expand All @@ -100,7 +93,7 @@ describe('React Components', () => {

it('scripts proxy correctly', async () => {
const html = await fixture.fetch('/').then((res) => res.text());
const $ = cheerioLoad(html);
const $ = cheerio.load(html);

for (const script of $('script').toArray()) {
const { src } = script.attribs;
Expand Down
3 changes: 0 additions & 3 deletions packages/integrations/deno/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,9 +23,6 @@ export default function createIntegration(args?: Options): AstroIntegration {
},
'astro:build:setup': ({ vite, target }) => {
if (target === 'server') {
vite.resolve = vite.resolve || {};
vite.resolve.alias = vite.resolve.alias || {};
vite.resolve.alias['react-dom/server'] = 'react-dom/server.browser'
vite.ssr = {
noExternal: true,
};
Expand Down
3 changes: 0 additions & 3 deletions packages/integrations/deno/test/basics.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,9 +13,6 @@ Deno.test({
assertEquals(resp.status, 200);
const html = await resp.text();
assert(html);
const doc = new DOMParser().parseFromString(html, `text/html`);
const div = doc.querySelector("#react");
assert(div, 'div exists');
});
},
});
Expand Down
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
import { defineConfig } from 'astro/config';
import deno from '@astrojs/deno';
import react from '@astrojs/react';

export default defineConfig({
adapter: deno(),
integrations: [react()],
experimental: {
ssr: true
}
Expand Down
3 changes: 1 addition & 2 deletions packages/integrations/deno/test/fixtures/basics/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
"private": true,
"dependencies": {
"astro": "workspace:*",
"@astrojs/deno": "workspace:*",
"@astrojs/react": "workspace:*"
"@astrojs/deno": "workspace:*"
}
}

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
import ReactComponent from '../components/React.jsx';
---
<html>
<head>
Expand All @@ -8,6 +8,5 @@ import ReactComponent from '../components/React.jsx';
</head>
<body>
<h1>Basic App on Deno</h1>
<ReactComponent />
</body>
</html>
Original file line number Diff line number Diff line change
Expand Up @@ -86,9 +86,6 @@ export function netlifyEdgeFunctions({ dist }: NetlifyEdgeFunctionsOptions = {})
},
'astro:build:setup': ({ vite, target }) => {
if (target === 'server') {
vite.resolve = vite.resolve || {};
vite.resolve.alias = vite.resolve.alias || {};
vite.resolve.alias['react-dom/server'] = 'react-dom/server.browser'
vite.ssr = {
noExternal: true,
};
Expand Down
1 change: 0 additions & 1 deletion packages/integrations/netlify/test/edge-functions/deps.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
// @ts-nocheck
export { fromFileUrl } from 'https://deno.land/std@0.110.0/path/mod.ts';
export { assertEquals, assert } from 'https://deno.land/std@0.132.0/testing/asserts.ts';
export * from 'https://deno.land/x/deno_dom/deno-dom-wasm.ts';
Original file line number Diff line number Diff line change
@@ -1,25 +1,20 @@
// @ts-ignore
import { runBuild } from './test-utils.ts';
// @ts-ignore
import { assertEquals, assert, DOMParser } from './deps.ts';
import { assertEquals, assert } from './deps.ts';

// @ts-ignore
Deno.test({
name: 'Edge Basics',
async fn() {
let close = await runBuild('./fixtures/edge-basic/');
const { default: handler } = await import(
'./fixtures/edge-basic/dist/edge-functions/entry.js'
'./fixtures/edge-basic/dist/edge-functions/entry.mjs'
);
const response = await handler(new Request('http://example.com/'));
assertEquals(response.status, 200);
const html = await response.text();
assert(html, 'got some html');

const doc = new DOMParser().parseFromString(html, `text/html`)!;
const div = doc.querySelector('#react');
assert(div, 'div exists');

await close();
},
});

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,12 +1,10 @@
import { defineConfig } from 'astro/config';
import { netlifyEdgeFunctions } from '@astrojs/netlify';
import react from "@astrojs/react";

export default defineConfig({
adapter: netlifyEdgeFunctions({
dist: new URL('./dist/', import.meta.url),
}),
integrations: [react()],
experimental: {
ssr: true
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
"private": true,
"dependencies": {
"astro": "workspace:*",
"@astrojs/react": "workspace:*",
"@astrojs/netlify": "workspace:*"
}
}

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,6 +1,3 @@
---
import ReactComponent from '../components/React.jsx';
---
<html>
<head><title>Testing</title></head>
<body>
Expand All @@ -9,6 +6,5 @@ import ReactComponent from '../components/React.jsx';
<ul>
<li><a href="/two/">Two</a></li>
</ul>
<ReactComponent />
</body>
</html>
76 changes: 4 additions & 72 deletions packages/integrations/react/server.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ function errorIsComingFromPreactComponent(err) {
);
}

async function check(Component, props, children) {
function check(Component, props, children) {
// Note: there are packages that do some unholy things to create "components".
// Checking the $$typeof property catches most of these patterns.
if (typeof Component === 'object') {
Expand Down Expand Up @@ -42,21 +42,15 @@ async function check(Component, props, children) {
return React.createElement('div');
}

await renderToStaticMarkup(Tester, props, children, {});
renderToStaticMarkup(Tester, props, children, {});

if (error) {
throw error;
}
return isReactComponent;
}

async function getNodeWritable() {
let nodeStreamBuiltinModuleName = 'stream';
let { Writable } = await import(nodeStreamBuiltinModuleName);
return Writable;
}

async function renderToStaticMarkup(Component, props, children, metadata) {
function renderToStaticMarkup(Component, props, children, metadata) {
delete props['class'];
const vnode = React.createElement(Component, {
...props,
Expand All @@ -65,74 +59,12 @@ async function renderToStaticMarkup(Component, props, children, metadata) {
let html;
if (metadata && metadata.hydrate) {
html = ReactDOM.renderToString(vnode);
if('renderToReadableStream' in ReactDOM) {
html = await renderToReadableStreamAsync(vnode);
} else {
html = await renderToPipeableStreamAsync(vnode);
}
} else {
if('renderToReadableStream' in ReactDOM) {
html = await renderToReadableStreamAsync(vnode);
} else {
html = await renderToStaticNodeStreamAsync(vnode);
}

html = ReactDOM.renderToStaticMarkup(vnode);
}
return { html };
}

async function renderToPipeableStreamAsync(vnode) {
const Writable = await getNodeWritable();
let html = '';
return new Promise((resolve, reject) => {
let error = undefined;
let stream = ReactDOM.renderToPipeableStream(vnode, {
onError(err) {
error = err;
reject(error);
},
onAllReady() {
stream.pipe(new Writable({
write(chunk, _encoding, callback) {
html += chunk.toString('utf-8');
callback();
},
destroy() {
resolve(html);
}
}));
}
});
});
}

async function renderToStaticNodeStreamAsync(vnode) {
const Writable = await getNodeWritable();
let html = '';
return new Promise((resolve) => {
let stream = ReactDOM.renderToStaticNodeStream(vnode);
stream.pipe(new Writable({
write(chunk, _encoding, callback) {
html += chunk.toString('utf-8');
callback();
},
destroy() {
resolve(html);
}
}));
});
}

async function renderToReadableStreamAsync(vnode) {
const decoder = new TextDecoder();
const stream = await ReactDOM.renderToReadableStream(vnode);
let html = '';
for await(const chunk of stream) {
html += decoder.decode(chunk);
}
return html;
}

export default {
check,
renderToStaticMarkup,
Expand Down
Loading

0 comments on commit e621c2f

Please sign in to comment.