Repository: FormidableLabs/urql (ts)

Issue:
Operation.operationName property has been depreciated with async headers
I am using the **fetchOptionsExhange** to support async headers:

https://formidable.com/open-source/urql/docs/common-questions/#how-do-we-achieve-asynchronous-fetchoptions

However, I get the ```Operation.operationName property has been depreciated``` warning while debugging... rather annoying.  The other proposed [solution](https://github.com/FormidableLabs/urql/pull/939) uses **localStorage** and **authState** which are **NOT** the same thing, and the latter being **React** only.

### Two notes here:

1.) Could we not make this native so it works without adding this crazy code.... simply like with **websockets** or **apollo**?  

- (I bet 100s of people have googled this, to have to hack it with an exchange that produces a warning...)

2.) Is it possible to get rid of the warning?



Pull request:
(core) - Remove deprecated operationName property from Operations
Close #1354

## Summary

In #1045 we've deprecated the `Operation.operationName` property as specced out in #1005.

I believe we're now ready to get rid of it as all exchanges that are maintained by us have been migrated over and nothing stops us from switching over as we've given sufficient time for people to adopt this change. The warning is still spurious in `@urql/devtools` and may confuse new users, so the sooner we can remove it the better.

## Set of changes

- Remove `operationName` and associated warning utilities
- Update test files / snapshots
- Bump bindings by a minor to force people onto the new `@urql/core` version

Patch:
diff --git a/.changeset/plenty-carrots-prove.md b/.changeset/plenty-carrots-prove.md
new file mode 100644
index 00000000..9cb1a292
--- /dev/null
+++ b/.changeset/plenty-carrots-prove.md
@@ -0,0 +1,10 @@
+---
+'@urql/core': major
+'@urql/preact': minor
+'@urql/svelte': minor
+'@urql/vue': minor
+'urql': minor
+---
+
+Remove deprecated `operationName` property from `Operation`s. The new `Operation.kind` property is now preferred. If you're creating new operations you may also use the `makeOperation` utility instead.
+When upgrading `@urql/core` please ensure that your package manager didn't install any duplicates of it. You may deduplicate it manually using `npx yarn-deduplicate` (for Yarn) or `npm dedupe` (for npm).
diff --git a/exchanges/graphcache/src/operations/write.ts b/exchanges/graphcache/src/operations/write.ts
index fbc44105..2e2244e3 100644
--- a/exchanges/graphcache/src/operations/write.ts
+++ b/exchanges/graphcache/src/operations/write.ts
@@ -94,23 +94,23 @@ export const startWrite = (
 ) => {
   const operation = getMainOperation(request.query);
   const result: WriteResult = { data, dependencies: getCurrentDependencies() };
-  const operationName = store.rootFields[operation.operation];
+  const kind = store.rootFields[operation.operation];
 
   const ctx = makeContext(
     store,
     normalizeVariables(operation, request.variables),
     getFragments(request.query),
-    operationName,
-    operationName,
+    kind,
+    kind,
     !!isOptimistic,
     error
   );
 
   if (process.env.NODE_ENV !== 'production') {
-    pushDebugNode(operationName, operation);
+    pushDebugNode(kind, operation);
   }
 
-  writeSelection(ctx, operationName, getSelectionSet(operation), data);
+  writeSelection(ctx, kind, getSelectionSet(operation), data);
 
   if (process.env.NODE_ENV !== 'production') {
     popDebugNode();
diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts
index 2aea604a..a61dea9c 100644
--- a/packages/core/src/types.ts
+++ b/packages/core/src/types.ts
@@ -57,9 +57,6 @@ export interface Operation<Data = any, Variables = any>
   extends GraphQLRequest<Data, Variables> {
   readonly kind: OperationType;
   context: OperationContext;
-
-  /** @deprecated use Operation.kind instead */
-  readonly operationName: OperationType;
 }
 
 /** Resulting data from an [operation]{@link Operation}. */
diff --git a/packages/core/src/utils/deprecation.ts b/packages/core/src/utils/deprecation.ts
deleted file mode 100644
index f1abf4e8..00000000
--- a/packages/core/src/utils/deprecation.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-export interface Warning {
-  key: string;
-  message: string;
-}
-
-/**
- * Module-scoped state to track if deprecation warnings have already been issued
- * for a particular key.
- */
-let issuedWarnings: Record<string, boolean> = {};
-
-/**
- * If a deprecation warning has not already been issued, use `console.warn()` to
- * issue it with an eye-catching prefix string.
- */
-export const deprecationWarning = ({ key, message }: Warning) => {
-  if (!issuedWarnings[key]) {
-    console.warn(`[WARNING: Deprecated] ${message}`);
-
-    issuedWarnings[key] = true;
-  }
-};
-
-/**
- * Clears all issued warnings - intended for use in testing.
- */
-export const _clearWarnings = () => {
-  issuedWarnings = {};
-};
diff --git a/packages/core/src/utils/index.ts b/packages/core/src/utils/index.ts
index ee2437c4..bba813b8 100644
--- a/packages/core/src/utils/index.ts
+++ b/packages/core/src/utils/index.ts
@@ -6,7 +6,6 @@ export * from './stringifyVariables';
 export * from './maskTypename';
 export * from './withPromise';
 export * from './operation';
-export * from './deprecation';
 
 export const noop = () => {
   /* noop */
diff --git a/packages/core/src/utils/operation.ts b/packages/core/src/utils/operation.ts
index 70a7bdfe..78eb157c 100644
--- a/packages/core/src/utils/operation.ts
+++ b/packages/core/src/utils/operation.ts
@@ -4,16 +4,6 @@ import {
   OperationContext,
   OperationType,
 } from '../types';
-import { Warning, deprecationWarning } from './deprecation';
-
-// TODO: Remove when the deprecated `operationName` property is removed
-const DEPRECATED: Record<string, Warning> = {
-  operationName: {
-    key: 'Operation.operationName',
-    message:
-      'The "Operation.operationName" property has been deprecated and will be removed in a future release of urql. Use "Operation.kind" instead.',
-  },
-};
 
 function makeOperation<Data = any, Variables = object>(
   kind: OperationType,
@@ -36,12 +26,6 @@ function makeOperation(kind, request, context) {
     variables: request.variables,
     kind,
     context,
-
-    get operationName(): OperationType {
-      deprecationWarning(DEPRECATED.operationName);
-
-      return this.kind;
-    },
   };
 }
 
diff --git a/scripts/jest/setup.js b/scripts/jest/setup.js
index ab9c0181..78436ea7 100644
--- a/scripts/jest/setup.js
+++ b/scripts/jest/setup.js
@@ -17,13 +17,3 @@ global.console = {
 jest.spyOn(console, 'log');
 jest.spyOn(console, 'warn');
 jest.spyOn(console, 'error');
-
-jest.mock('../../packages/core/src/utils/deprecation.ts', () => ({
-  deprecationWarning({ message }) {
-    const error = new Error(`Deprecation Warnings are thrown in tests.\n${message}`);
-    if (!/jest-snapshot|pretty-format|jest-jasmine2/i.test(error.stack)) {
-      throw error;
-    }
-  },
-  _clearWarnings() {},
-}));


Test patch:
diff --git a/exchanges/multipart-fetch/src/__snapshots__/multipartFetchExchange.test.ts.snap b/exchanges/multipart-fetch/src/__snapshots__/multipartFetchExchange.test.ts.snap
index d8a6ac57..34b8d666 100644
--- a/exchanges/multipart-fetch/src/__snapshots__/multipartFetchExchange.test.ts.snap
+++ b/exchanges/multipart-fetch/src/__snapshots__/multipartFetchExchange.test.ts.snap
@@ -15,7 +15,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -185,7 +184,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -357,7 +355,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -531,7 +528,6 @@ Object {
     },
     "key": 3,
     "kind": "mutation",
-    "operationName": "mutation",
     "query": Object {
       "__key": 3781860981,
       "definitions": Array [
@@ -681,7 +677,6 @@ Object {
     },
     "key": 3,
     "kind": "mutation",
-    "operationName": "mutation",
     "query": Object {
       "__key": 1193185401,
       "definitions": Array [
diff --git a/exchanges/refocus/src/refocusExchange.test.ts b/exchanges/refocus/src/refocusExchange.test.ts
index e90777d1..d8bbdf64 100644
--- a/exchanges/refocus/src/refocusExchange.test.ts
+++ b/exchanges/refocus/src/refocusExchange.test.ts
@@ -88,8 +88,5 @@ it(`attaches a listener and redispatches queries on call`, () => {
     key: 1,
     query: queryOne,
     kind: 'query',
-
-    // TODO: Remove this when the deprecated "operationName" property is removed
-    operationName: 'query',
   });
 });
diff --git a/packages/core/src/client.test.ts b/packages/core/src/client.test.ts
index 809db44d..5336ebd3 100755
--- a/packages/core/src/client.test.ts
+++ b/packages/core/src/client.test.ts
@@ -151,9 +151,6 @@ describe('synchronous methods', () => {
         context: expect.anything(),
         key: expect.any(Number),
         kind: 'query',
-
-        // TODO: Remove this when the deprecated `operationName` property is removed
-        operationName: 'query',
       },
     });
   });
diff --git a/packages/core/src/exchanges/__snapshots__/fetch.test.ts.snap b/packages/core/src/exchanges/__snapshots__/fetch.test.ts.snap
index f0691c4e..6d1d342c 100644
--- a/packages/core/src/exchanges/__snapshots__/fetch.test.ts.snap
+++ b/packages/core/src/exchanges/__snapshots__/fetch.test.ts.snap
@@ -15,7 +15,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -185,7 +184,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -357,7 +355,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
diff --git a/packages/core/src/exchanges/__snapshots__/subscription.test.ts.snap b/packages/core/src/exchanges/__snapshots__/subscription.test.ts.snap
index 53c422fa..864ba6fc 100644
--- a/packages/core/src/exchanges/__snapshots__/subscription.test.ts.snap
+++ b/packages/core/src/exchanges/__snapshots__/subscription.test.ts.snap
@@ -15,7 +15,6 @@ Object {
     },
     "key": 4,
     "kind": "subscription",
-    "operationName": "subscription",
     "query": Object {
       "__key": 2616620656,
       "definitions": Array [
diff --git a/packages/core/src/internal/__snapshots__/fetchSource.test.ts.snap b/packages/core/src/internal/__snapshots__/fetchSource.test.ts.snap
index 994af45b..2dbf72ae 100644
--- a/packages/core/src/internal/__snapshots__/fetchSource.test.ts.snap
+++ b/packages/core/src/internal/__snapshots__/fetchSource.test.ts.snap
@@ -15,7 +15,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -175,7 +174,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -335,7 +333,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -499,7 +496,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
@@ -679,7 +675,6 @@ Object {
     },
     "key": 2,
     "kind": "query",
-    "operationName": "query",
     "query": Object {
       "__key": 3044551916,
       "definitions": Array [
diff --git a/packages/core/src/utils/deprecation.test.ts b/packages/core/src/utils/deprecation.test.ts
deleted file mode 100644
index 89c0da4e..00000000
--- a/packages/core/src/utils/deprecation.test.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-jest.unmock('./deprecation.ts');
-
-import { _clearWarnings, deprecationWarning } from './deprecation';
-
-describe('deprecationWarning()', () => {
-  let warn: jest.SpyInstance;
-
-  const key = 'deprecation.test';
-  const message = 'Test deprecation message.';
-
-  beforeAll(() => {
-    warn = jest.spyOn(console, 'warn');
-  });
-
-  afterEach(_clearWarnings);
-
-  afterAll(() => {
-    warn.mockRestore();
-  });
-
-  it('only calls console.warn once per key', () => {
-    deprecationWarning({ key, message });
-    deprecationWarning({ key, message });
-    deprecationWarning({ key, message });
-
-    expect(warn).toBeCalledTimes(1);
-    expect(warn).toBeCalledWith(`[WARNING: Deprecated] ${message}`);
-  });
-});