fix path on Windows (#4544)

Summary:
- closes #3272

sibelius, here is a PR addressing this long-standing issue. This is a follow-up to your [comment](#3272 (comment)).

Pull Request resolved: #4544

Reviewed By: captbaritone, tyao1

Differential Revision: D52567994

Pulled By: alunyov

fbshipit-source-id: b5be2c7d70107ba6dca2daf538e94281a1eac826

packages/babel-plugin-relay/__tests__/BabelPluginRelay-path-test.js

@@ -0,0 +1,46 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @format
+ * @oncall relay
+ */
+
+'use strict';
+
+describe('`development` option', () => {
+  function transformOnPlatform(platform: string) {
+    jest.resetModules();
+
+    Object.defineProperty(process, 'platform', {
+      value: platform,
+    });
+
+    jest.doMock('path', () => {
+      if (platform === 'win32') {
+        return jest.requireActual('path').win32;
+      } else {
+        return jest.requireActual('path').posix;
+      }
+    });
+
+    const transformerWithOptions = require('./transformerWithOptions');
+
+    return transformerWithOptions(
+      {
+        artifactDirectory: '/test/artifacts',
+      },
+      'development',
+    )('graphql`fragment TestFrag on Node { id }`');
+  }
+
+  it('tests the handling of file path', () => {
+    const codeOnPosix = transformOnPlatform('linux');
+    const codeOnNonPosix = transformOnPlatform('win32');
+
+    expect(codeOnNonPosix).toEqual(codeOnPosix);
+    expect(codeOnPosix).toMatchSnapshot();
+  });
+});

packages/babel-plugin-relay/__tests__/__snapshots__/BabelPluginRelay-path-test.js.snap

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`\`development\` option tests the handling of file path 1`] = `
+"var _TestFrag;
+_TestFrag !== void 0
+  ? _TestFrag
+  : ((_TestFrag = require('./test/artifacts/TestFrag.graphql')),
+    _TestFrag.hash &&
+      _TestFrag.hash !== '0bb6b7b29bc3e910921551c4ff5b6757' &&
+      console.error(
+        \\"The definition of 'TestFrag' appears to have changed. Run \`relay-compiler\` to update the generated files to receive the expected data.\\",
+      ),
+    _TestFrag);
+"
+`;

packages/babel-plugin-relay/compileGraphQLTag.js

@@ -29,6 +29,14 @@ const {
 
 const GENERATED = './__generated__/';
 
+/**
+ * Converts backslashes in a path to forward slashes (POSIX style) for
+ * cross-platform compatibility.
+ */
+function posixifyPath(path: string): string {
+  return process.platform === 'win32' ? path.replace(/\\/g, '/') : path;
+}
+
 /**
  * Given a graphql`` tagged template literal, replace it with the appropriate
  * runtime artifact.
@@ -107,11 +115,13 @@ function createNode(
     throw new Error('GraphQL operations and fragments must contain names');
   }
   const requiredFile = definitionName + '.graphql';
-  const requiredPath = options.isHasteMode
-    ? requiredFile
-    : options.artifactDirectory
-    ? getRelativeImportPath(state, options.artifactDirectory, requiredFile)
-    : GENERATED + requiredFile;
+  const requiredPath = posixifyPath(
+    options.isHasteMode
+      ? requiredFile
+      : options.artifactDirectory
+      ? getRelativeImportPath(state, options.artifactDirectory, requiredFile)
+      : GENERATED + requiredFile,
+  );
 
   const hash = crypto
     .createHash('md5')