From e12ae8f9320928c74f1a0bd5bf42804253a36299 Mon Sep 17 00:00:00 2001
From: Gregory Schier <gschier1990@gmail.com>
Date: Wed, 25 Jul 2018 12:24:47 -0400
Subject: [PATCH] Better GraphQL query highlighting

---
 .../editors/body/graph-ql-editor.js           | 29 ++++++++++++++-----
 1 file changed, 22 insertions(+), 7 deletions(-)

diff --git a/packages/insomnia-app/app/ui/components/editors/body/graph-ql-editor.js b/packages/insomnia-app/app/ui/components/editors/body/graph-ql-editor.js
index 824e34c52..6f43557a9 100644
--- a/packages/insomnia-app/app/ui/components/editors/body/graph-ql-editor.js
+++ b/packages/insomnia-app/app/ui/components/editors/body/graph-ql-editor.js
@@ -110,19 +110,34 @@ class GraphQLEditor extends React.PureComponent<Props, State> {
     const cursor = _queryEditor.getCursor();
     const cursorIndex = _queryEditor.indexFromPos(cursor);
 
+    let operationName = null;
+    let allOperationNames = [];
+
     // Loop through all operations to see if one contains the cursor.
     for (let i = 0; i < operations.length; i++) {
       const operation = operations[i];
-      if (
-        operation.loc.start <= cursorIndex &&
-        operation.loc.end >= cursorIndex &&
-        operation.name
-      ) {
-        return operation.name.value;
+
+      if (!operation.name) {
+        continue;
+      }
+
+      allOperationNames.push(operation.name.value);
+
+      const { start, end } = operation.loc;
+      if (start <= cursorIndex && end >= cursorIndex) {
+        operationName = operation.name.value;
       }
     }
 
-    return null;
+    if (!operationName && operations.length > 0) {
+      operationName = this.state.body.operationName || null;
+    }
+
+    if (!allOperationNames.includes(operationName)) {
+      return null;
+    }
+
+    return operationName;
   }
 
   _handleQueryFocus() {