test: react

packages/react/test/provider.js

@@ -0,0 +1,16 @@
+import {expect} from 'chai';
+
+import {withWeb} from '@flecks/headless/test/helpers/with-web';
+
+it('implements react providers', withWeb(
+  async ({page, response}) => {
+    expect(response)
+      .to.not.be.null;
+    expect(response.ok())
+      .to.be.true;
+    const output = await page.waitForSelector('.provider-test');
+    expect(await output?.evaluate((el) => el.textContent))
+      .to.equal('foobar');
+  },
+  {template: 'templates/provider'},
+));

packages/react/test/ssr.js

@@ -0,0 +1,21 @@
+import {expect} from 'chai';
+
+import {withWeb} from '@flecks/headless/test/helpers/with-web';
+
+it('does ssr', withWeb(
+  async ({page, response}) => {
+    expect(response)
+      .to.not.be.null;
+    expect(response.ok())
+      .to.be.true;
+    const output = await page.waitForSelector('.provider-test');
+    expect(await output?.evaluate((el) => el.textContent))
+      .to.equal('foobar');
+  },
+  {
+    beforePage: async ({page}) => {
+      await page.setJavaScriptEnabled(false);
+    },
+    template: 'templates/provider',
+  },
+));

packages/react/test/templates/provider/build/flecks.yml

@@ -0,0 +1,4 @@
+'@flecks/core': {}
+'@flecks/server': {}
+'@flecks/react': {}
+'test:./test': {}

packages/react/test/templates/provider/package.json

@@ -0,0 +1 @@
+{}

packages/react/test/templates/provider/test/package.json

@@ -0,0 +1,3 @@
+{
+  "dependencies": {"@flecks/react": "*"}
+}

packages/react/test/templates/provider/test/src/context.js

@@ -0,0 +1,3 @@
+import {createContext} from '@flecks/react';
+
+export const Context = createContext();

packages/react/test/templates/provider/test/src/index.js

@@ -0,0 +1,7 @@
+import {Context} from './context';
+import {Component} from './root';
+
+export const hooks = {
+  '@flecks/react.providers': () => [Context.Provider, {value: 'foobar'}],
+  '@flecks/react.roots': () => Component,
+};

packages/react/test/templates/provider/test/src/root.jsx

@@ -0,0 +1,8 @@
+import {useContext, React} from '@flecks/react';
+
+import {Context} from './context';
+
+export function Component() {
+  const foobar = useContext(Context);
+  return <div className="provider-test">{foobar}</div>;
+}