Skip to content

Commit

Permalink
Add memo highlight test fixture
Browse files Browse the repository at this point in the history
  • Loading branch information
marvinhagemeister committed Jun 6, 2022
1 parent 93f2b3b commit ebd15a2
Showing 1 changed file with 47 additions and 0 deletions.
47 changes: 47 additions & 0 deletions test-e2e/fixtures/apps/memo-highlight.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
import { h, render } from "preact";
import { useState } from "preact/hooks";
import { memo } from "preact/compat";

export const Result = ({ result }) => {
return (
<div class="result">
<Nested text={result} />
</div>
);
};

const Nested = ({ text }) => {
return <p>{text}</p>;
};

const MemoResult = memo(Result, () => true);

const generateFakeData = () => {
const rand = () => Math.random() * 10;
return new Array(3).fill(rand());
};

const App = () => {
const [results, setResults] = useState(generateFakeData());

return (
<div>
<h1>Example</h1>
<button onClick={() => setResults(generateFakeData())}>Refresh</button>
<div class="list">
<h2>No memo</h2>
{results.map((result, i) => (
<Result key={i} result={result} />
))}
</div>
<div class="list">
<h2>Memo</h2>
{results.map((result, i) => (
<MemoResult key={i} result={result} />
))}
</div>
</div>
);
};

render(<App />, document.getElementById("app"));

0 comments on commit ebd15a2

Please sign in to comment.