Skip to content

Commit

Permalink
fix: spread nested required chunks array
Browse files Browse the repository at this point in the history
  • Loading branch information
@markwoodward23
markwoodward23 committed Aug 4, 2020
1 parent 664cfa1 commit 95e6ecb
Show file tree
Hide file tree
Showing 2 changed files with 119 additions and 133 deletions.
6 changes: 3 additions & 3 deletions packages/server/src/ChunkExtractor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -297,7 +297,7 @@ class ChunkExtractor {
].join('')
}

getRequiredChunksScriptElement(extraProps) {
getRequiredChunksScriptElements(extraProps) {

This comment has been minimized.

Sign in to view

Copy link
@willdurand

willdurand Sep 17, 2020

Renaming such a method seems to be a breaking change. I don't know if ChunkExtractor is considered a private API but we were surprised to see breakages in a patch release update.

This comment has been minimized.

Sign in to view

Copy link
@theKashey

theKashey Sep 17, 2020

Collaborator

It is definitely undocumented internal API 😅
const id = getRequiredChunkKey(this.namespace)
const props = {
type: 'application/json',
Expand Down Expand Up @@ -381,14 +381,14 @@ class ChunkExtractor {
}

getScriptElements(extraProps = {}) {
const requiredScriptElement = this.getRequiredChunksScriptElement(
const requiredScriptElements = this.getRequiredChunksScriptElements(
extraProps,
)
const mainAssets = this.getMainAssets('script')
const assetsScriptElements = mainAssets.map(asset =>
assetToScriptElement(asset, extraProps),
)
return [requiredScriptElement, ...assetsScriptElements]
return [...requiredScriptElements, ...assetsScriptElements]
}

getCssString() {
Expand Down
246 changes: 116 additions & 130 deletions packages/server/src/ChunkExtractor.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -133,26 +133,24 @@ describe('ChunkExtrator', () => {
})
expect(extractor.getScriptElements()).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
id="testapp__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
}
id="testapp__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
id="testapp__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
],
}
id="testapp__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -165,26 +163,24 @@ describe('ChunkExtrator', () => {
it('should return main script tag without chunk', () => {
expect(extractor.getScriptElements()).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -198,26 +194,24 @@ describe('ChunkExtrator', () => {
extractor.addChunk('letters-A')
expect(extractor.getScriptElements()).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -236,26 +230,24 @@ describe('ChunkExtrator', () => {
extractor.addChunk('letters-E')
expect(extractor.getScriptElements()).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"letters-E\\"]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"letters-E\\"]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-E\\"]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-E\\"]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -275,28 +267,26 @@ describe('ChunkExtrator', () => {
expect(extractor.getScriptElements({ nonce: 'testnonce' }))
.toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
nonce="testnonce"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
nonce="testnonce"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
nonce="testnonce"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
nonce="testnonce"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -321,28 +311,26 @@ describe('ChunkExtrator', () => {
}),
).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[\\"chunk-0-for-letters-A\\"]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
nonce="anonymous"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
nonce="anonymous"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[\\"letters-A\\"]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
nonce="anonymous"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
nonce="anonymous"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand All @@ -368,26 +356,24 @@ describe('ChunkExtrator', () => {

expect(extractor.getScriptElements()).toMatchInlineSnapshot(`
Array [
Array [
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
<script
dangerouslySetInnerHTML={
Object {
"__html": "[]",
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
}
id="__LOADABLE_REQUIRED_CHUNKS__"
type="application/json"
/>,
<script
dangerouslySetInnerHTML={
Object {
"__html": "{\\"namedChunks\\":[]}",
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
],
}
id="__LOADABLE_REQUIRED_CHUNKS___ext"
type="application/json"
/>,
<script
async={true}
data-chunk="main"
Expand Down

0 comments on commit 95e6ecb

Please sign in to comment.