Support null variables

CHANGELOG.md

@@ -1,5 +1,9 @@
 # master
 
+## Improvements
+
+- Experimental support for allowing `null` in operation variables. Add `@rescriptRelayNullableVariables` to your operation (query, mutation, subscription) and you'll be allowed to pass `Js.Nullable.null` to your server. https://github.com/zth/rescript-relay/pull/426
+
 # 1.0.4
 
 ## Improvements

packages/rescript-relay/__tests__/Test_nullableVariables-tests.js

@@ -0,0 +1,49 @@
+require("@testing-library/jest-dom/extend-expect");
+const t = require("@testing-library/react");
+const React = require("react");
+const queryMock = require("./queryMock");
+const ReactTestUtils = require("react-dom/test-utils");
+
+const { test_nullableVariables } = require("./Test_nullableVariables.bs");
+
+describe("Mutation", () => {
+  test("variables can be null", async () => {
+    queryMock.mockQuery({
+      name: "TestNullableVariablesQuery",
+      data: {
+        loggedInUser: {
+          id: "user-1",
+          avatarUrl: "avatar-url-1",
+        },
+      },
+    });
+
+    t.render(test_nullableVariables());
+    await t.screen.findByText("Avatar url is avatar-url-1");
+
+    queryMock.mockQuery({
+      name: "TestNullableVariablesMutation",
+      variables: {
+        avatarUrl: null,
+        someInput: {
+          int: null,
+        },
+      },
+      data: {
+        updateUserAvatar: {
+          user: {
+            id: "user-1",
+            avatarUrl: null,
+            someRandomArgField: "test",
+          },
+        },
+      },
+    });
+
+    ReactTestUtils.act(() => {
+      t.fireEvent.click(t.screen.getByText("Change avatar URL"));
+    });
+
+    await t.screen.findByText("Avatar url is -");
+  });
+});

packages/rescript-relay/__tests__/Test_nullableVariables.res

@@ -0,0 +1,62 @@
+module Query = %relay(`
+    query TestNullableVariablesQuery {
+      loggedInUser {
+        avatarUrl
+      }
+    }
+`)
+
+module Mutation = %relay(`
+    mutation TestNullableVariablesMutation($avatarUrl: String, $someInput: SomeInput) @rescriptRelayNullableVariables {
+      updateUserAvatar(avatarUrl: $avatarUrl) {
+        user {
+          avatarUrl
+          someRandomArgField(someInput: $someInput)
+        }
+      }
+    }
+`)
+
+module Test = {
+  @react.component
+  let make = () => {
+    let environment = RescriptRelay.useEnvironmentFromContext()
+    let query = Query.use(~variables=(), ())
+    let data = query.loggedInUser
+
+    <div>
+      {React.string("Avatar url is " ++ data.avatarUrl->Belt.Option.getWithDefault("-"))}
+      <button
+        onClick={_ => {
+          Mutation.commitMutation(
+            ~environment,
+            ~variables={
+              avatarUrl: Js.Nullable.null,
+              someInput: Js.Nullable.return({
+                RelaySchemaAssets_graphql.int: Js.Nullable.null,
+              }),
+            },
+            (),
+          )->RescriptRelay.Disposable.ignore
+        }}>
+        {React.string("Change avatar URL")}
+      </button>
+    </div>
+  }
+}
+
+@live
+let test_nullableVariables = () => {
+  let network = RescriptRelay.Network.makePromiseBased(~fetchFunction=RelayEnv.fetchQuery, ())
+
+  let environment = RescriptRelay.Environment.make(
+    ~network,
+    ~store=RescriptRelay.Store.make(~source=RescriptRelay.RecordSource.make(), ()),
+    (),
+  )
+  ()
+
+  <TestProviders.Wrapper environment>
+    <Test />
+  </TestProviders.Wrapper>
+}