Skip to content

Commit

Permalink
Update (base update)
Browse files Browse the repository at this point in the history 
[ghstack-poisoned]
  • Loading branch information
@mofeiZ
mofeiZ committed Sep 30, 2024
2 parents bc2aa2b + c67e241 commit e001896
Show file tree
Hide file tree
Showing 15 changed files with 340 additions and 161 deletions.
2 changes: 1 addition & 1 deletion ...react-compiler/src/__tests__/fixtures/compiler/nested-optional-chains.expect.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ function useFoo({
// prop3 and prop4?.inner should be hoisted as the dependency of z
const z = prop3?.fn(prop4?.inner.value).toString();

// prop5 and prop4?.inner should be hoisted as the dependency of z
// prop5 and prop6?.inner should be hoisted as the dependency of zz
const zz = prop5?.fn(prop6?.inner.value)?.toString();
return [x, y, z, zz];
}
Expand Down
2 changes: 1 addition & 1 deletion ...ges/babel-plugin-react-compiler/src/__tests__/fixtures/compiler/nested-optional-chains.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ function useFoo({
// prop3 and prop4?.inner should be hoisted as the dependency of z
const z = prop3?.fn(prop4?.inner.value).toString();

// prop5 and prop4?.inner should be hoisted as the dependency of z
// prop5 and prop6?.inner should be hoisted as the dependency of zz
const zz = prop5?.fn(prop6?.inner.value)?.toString();
return [x, y, z, zz];
}
Expand Down
96 changes: 73 additions & 23 deletions ...rc/__tests__/fixtures/compiler/optional-member-expression-as-memo-dep.expect.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,46 +3,96 @@

```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
function Component(props) {
import {identity, ValidateMemoization} from 'shared-runtime';
import {useMemo} from 'react';

function Component({arg}) {
const data = useMemo(() => {
return props?.items.edges?.nodes.map();
}, [props?.items.edges?.nodes]);
return <Foo data={data} />;
return arg?.items.edges?.nodes.map(identity);
}, [arg?.items.edges?.nodes]);
return (
<ValidateMemoization inputs={[arg?.items.edges?.nodes]} output={data} />
);
}
export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{arg: null}],
sequentialRenders: [
{arg: null},
{arg: null},
{arg: {items: {edges: null}}},
{arg: {items: {edges: null}}},
{arg: {items: {edges: {nodes: [1, 2, 'hello']}}}},
{arg: {items: {edges: {nodes: [1, 2, 'hello']}}}},
],
};

```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
function Component(props) {
const $ = _c(4);
import { identity, ValidateMemoization } from "shared-runtime";
import { useMemo } from "react";

function Component(t0) {
const $ = _c(7);
const { arg } = t0;

props?.items.edges?.nodes;
let t0;
arg?.items.edges?.nodes;
let t1;
if ($[0] !== props?.items.edges?.nodes) {
t1 = props?.items.edges?.nodes.map();
$[0] = props?.items.edges?.nodes;
$[1] = t1;
let t2;
if ($[0] !== arg?.items.edges?.nodes) {
t2 = arg?.items.edges?.nodes.map(identity);
$[0] = arg?.items.edges?.nodes;
$[1] = t2;
} else {
t1 = $[1];
t2 = $[1];
}
t0 = t1;
const data = t0;
let t2;
if ($[2] !== data) {
t2 = <Foo data={data} />;
$[2] = data;
$[3] = t2;
t1 = t2;
const data = t1;

const t3 = arg?.items.edges?.nodes;
let t4;
if ($[2] !== t3) {
t4 = [t3];
$[2] = t3;
$[3] = t4;
} else {
t4 = $[3];
}
let t5;
if ($[4] !== t4 || $[5] !== data) {
t5 = <ValidateMemoization inputs={t4} output={data} />;
$[4] = t4;
$[5] = data;
$[6] = t5;
} else {
t2 = $[3];
t5 = $[6];
}
return t2;
return t5;
}

export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{ arg: null }],
sequentialRenders: [
{ arg: null },
{ arg: null },
{ arg: { items: { edges: null } } },
{ arg: { items: { edges: null } } },
{ arg: { items: { edges: { nodes: [1, 2, "hello"] } } } },
{ arg: { items: { edges: { nodes: [1, 2, "hello"] } } } },
],
};

```
### Eval output
(kind: exception) Fixture not implemented
(kind: ok) <div>{"inputs":[null]}</div>
<div>{"inputs":[null]}</div>
<div>{"inputs":[null]}</div>
<div>{"inputs":[null]}</div>
<div>{"inputs":[[1,2,"hello"]],"output":[1,2,"hello"]}</div>
<div>{"inputs":[[1,2,"hello"]],"output":[1,2,"hello"]}</div>
25 changes: 21 additions & 4 deletions ...-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-as-memo-dep.js
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,24 @@
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
function Component(props) {
import {identity, ValidateMemoization} from 'shared-runtime';
import {useMemo} from 'react';

function Component({arg}) {
const data = useMemo(() => {
return props?.items.edges?.nodes.map();
}, [props?.items.edges?.nodes]);
return <Foo data={data} />;
return arg?.items.edges?.nodes.map(identity);
}, [arg?.items.edges?.nodes]);
return (
<ValidateMemoization inputs={[arg?.items.edges?.nodes]} output={data} />
);
}
export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{arg: null}],
sequentialRenders: [
{arg: null},
{arg: null},
{arg: {items: {edges: null}}},
{arg: {items: {edges: null}}},
{arg: {items: {edges: {nodes: [1, 2, 'hello']}}}},
{arg: {items: {edges: {nodes: [1, 2, 'hello']}}}},
],
};
82 changes: 55 additions & 27 deletions ...ler/src/__tests__/fixtures/compiler/optional-member-expression-single.expect.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,60 +4,88 @@
```javascript
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
import {useMemo} from 'react';
function Component({arg}) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
x.push(arg?.items);
return x;
}, [props?.items]);
return <ValidateMemoization inputs={[props?.items]} output={data} />;
}, [arg?.items]);
return <ValidateMemoization inputs={[arg?.items]} output={data} />;
}

export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{arg: {items: 2}}],
sequentialRenders: [
{arg: {items: 2}},
{arg: {items: 2}},
{arg: null},
{arg: null},
],
};

```
## Code
```javascript
import { c as _c } from "react/compiler-runtime"; // @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import { ValidateMemoization } from "shared-runtime";
function Component(props) {
import { useMemo } from "react";
function Component(t0) {
const $ = _c(7);
const { arg } = t0;

props?.items;
let t0;
arg?.items;
let t1;
let x;
if ($[0] !== props?.items) {
if ($[0] !== arg?.items) {
x = [];
x.push(props?.items);
$[0] = props?.items;
x.push(arg?.items);
$[0] = arg?.items;
$[1] = x;
} else {
x = $[1];
}
t0 = x;
const data = t0;
const t1 = props?.items;
let t2;
if ($[2] !== t1) {
t2 = [t1];
$[2] = t1;
$[3] = t2;
t1 = x;
const data = t1;
const t2 = arg?.items;
let t3;
if ($[2] !== t2) {
t3 = [t2];
$[2] = t2;
$[3] = t3;
} else {
t2 = $[3];
t3 = $[3];
}
let t3;
if ($[4] !== t2 || $[5] !== data) {
t3 = <ValidateMemoization inputs={t2} output={data} />;
$[4] = t2;
let t4;
if ($[4] !== t3 || $[5] !== data) {
t4 = <ValidateMemoization inputs={t3} output={data} />;
$[4] = t3;
$[5] = data;
$[6] = t3;
$[6] = t4;
} else {
t3 = $[6];
t4 = $[6];
}
return t3;
return t4;
}

export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{ arg: { items: 2 } }],
sequentialRenders: [
{ arg: { items: 2 } },
{ arg: { items: 2 } },
{ arg: null },
{ arg: null },
],
};

```
### Eval output
(kind: exception) Fixture not implemented
(kind: ok) <div>{"inputs":[2],"output":[2]}</div>
<div>{"inputs":[2],"output":[2]}</div>
<div>{"inputs":[null],"output":[null]}</div>
<div>{"inputs":[null],"output":[null]}</div>
20 changes: 16 additions & 4 deletions ...lugin-react-compiler/src/__tests__/fixtures/compiler/optional-member-expression-single.js
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,22 @@
// @validatePreserveExistingMemoizationGuarantees @enableOptionalDependencies
import {ValidateMemoization} from 'shared-runtime';
function Component(props) {
import {useMemo} from 'react';
function Component({arg}) {
const data = useMemo(() => {
const x = [];
x.push(props?.items);
x.push(arg?.items);
return x;
}, [props?.items]);
return <ValidateMemoization inputs={[props?.items]} output={data} />;
}, [arg?.items]);
return <ValidateMemoization inputs={[arg?.items]} output={data} />;
}

export const FIXTURE_ENTRYPOINT = {
fn: Component,
params: [{arg: {items: 2}}],
sequentialRenders: [
{arg: {items: 2}},
{arg: {items: 2}},
{arg: null},
{arg: null},
],
};
2 changes: 1 addition & 1 deletion ...ixtures/compiler/propagate-scope-deps-hir-fork/nested-optional-chains.expect.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ function useFoo({
// prop3 and prop4?.inner should be hoisted as the dependency of z
const z = prop3?.fn(prop4?.inner.value).toString();

// prop5 and prop4?.inner should be hoisted as the dependency of z
// prop5 and prop6?.inner should be hoisted as the dependency of zz
const zz = prop5?.fn(prop6?.inner.value)?.toString();
return [x, y, z, zz];
}
Expand Down
2 changes: 1 addition & 1 deletion ...r/src/__tests__/fixtures/compiler/propagate-scope-deps-hir-fork/nested-optional-chains.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ function useFoo({
// prop3 and prop4?.inner should be hoisted as the dependency of z
const z = prop3?.fn(prop4?.inner.value).toString();

// prop5 and prop4?.inner should be hoisted as the dependency of z
// prop5 and prop6?.inner should be hoisted as the dependency of zz
const zz = prop5?.fn(prop6?.inner.value)?.toString();
return [x, y, z, zz];
}
Expand Down
Loading

0 comments on commit e001896

Please sign in to comment.