From fd8917e5c109840c1bfa4c2c0902b6dcec200286 Mon Sep 17 00:00:00 2001
From: Ben Blowers <benblowers@outlook.com>
Date: Tue, 12 Apr 2022 10:19:15 +0100
Subject: [PATCH] fix: prefix operation ids with parent id (#1245)

Co-authored-by: ben.blowers <ben.blowers@imanage.com>
Co-authored-by: anastasiia-developer <anastasiia@redocly.com>
---
 e2e/integration/menu.e2e.ts            |  2 +-
 e2e/integration/misc.e2e.ts            |  8 ++++----
 e2e/integration/urls.e2e.ts            | 19 +++++++++++++++++++
 src/components/Operation/Operation.tsx |  3 ++-
 src/services/models/Operation.ts       |  4 +++-
 5 files changed, 29 insertions(+), 7 deletions(-)
 create mode 100644 e2e/integration/urls.e2e.ts

diff --git a/e2e/integration/menu.e2e.ts b/e2e/integration/menu.e2e.ts
index b3b4090a6a..d958b5894b 100644
--- a/e2e/integration/menu.e2e.ts
+++ b/e2e/integration/menu.e2e.ts
@@ -49,7 +49,7 @@ describe('Menu', () => {
     cy.location('hash').should('equal', '#tag/pet');
 
     cy.contains('[role=menuitem]', 'Find pet by ID').click({ force: true });
-    cy.location('hash').should('equal', '#operation/getPetById');
+    cy.location('hash').should('equal', '#tag/pet/operation/getPetById');
   });
 
   it('should deactivate tag when other is activated', () => {
diff --git a/e2e/integration/misc.e2e.ts b/e2e/integration/misc.e2e.ts
index 6466bca4cd..a6fa129a63 100644
--- a/e2e/integration/misc.e2e.ts
+++ b/e2e/integration/misc.e2e.ts
@@ -21,12 +21,12 @@ describe('Servers', () => {
       initReDoc(win, spec, {});
 
       // TODO add cy-data attributes
-      cy.get('[data-section-id="operation/addPet"]').should(
+      cy.get('[data-section-id="tag/pet/operation/addPet"]').should(
         'contain',
         'http://petstore.swagger.io/v2/pet',
       );
 
-      cy.get('[data-section-id="operation/addPet"]').should(
+      cy.get('[data-section-id="tag/pet/operation/addPet"]').should(
         'contain',
         'http://petstore.swagger.io/sandbox/pet',
       );
@@ -40,7 +40,7 @@ describe('Servers', () => {
       initReDoc(win, spec, {});
 
       // TODO add cy-data attributes
-      cy.get('[data-section-id="operation/addPet"]').should(
+      cy.get('[data-section-id="tag/pet/operation/addPet"]').should(
         'contain',
         'http://localhost:' + win.location.port + '/pet',
       );
@@ -55,7 +55,7 @@ describe('Servers', () => {
       initReDoc(win, spec, {});
 
       // TODO add cy-data attributes
-      cy.get('[data-section-id="operation/addPet"]').should(
+      cy.get('[data-section-id="tag/pet/operation/addPet"]').should(
         'contain',
         'http://localhost:' + win.location.port + '/pet',
       );
diff --git a/e2e/integration/urls.e2e.ts b/e2e/integration/urls.e2e.ts
new file mode 100644
index 0000000000..9db718f0bf
--- /dev/null
+++ b/e2e/integration/urls.e2e.ts
@@ -0,0 +1,19 @@
+describe('Supporting both operation/* and parent/*/operation* urls', () => {
+  beforeEach(() => {
+    cy.visit('e2e/standalone.html');
+  });
+
+  it('should supporting operation/* url', () => {
+    cy.url().then(loc => {
+      cy.visit(loc + '#operation/updatePet');
+      cy.get('li[data-item-id="tag/pet/operation/updatePet"]').should('be.visible');
+    });
+  });
+
+  it('should supporting parent/*/operation url', () => {
+    cy.url().then(loc => {
+      cy.visit(loc + '#tag/pet/operation/addPet');
+      cy.get('li[data-item-id="tag/pet/operation/addPet"]').should('be.visible');
+    });
+  });
+});
diff --git a/src/components/Operation/Operation.tsx b/src/components/Operation/Operation.tsx
index cae98266fc..8170351e7f 100644
--- a/src/components/Operation/Operation.tsx
+++ b/src/components/Operation/Operation.tsx
@@ -17,6 +17,7 @@ import { RequestSamples } from '../RequestSamples/RequestSamples';
 import { ResponsesList } from '../Responses/ResponsesList';
 import { ResponseSamples } from '../ResponseSamples/ResponseSamples';
 import { SecurityRequirements } from '../SecurityRequirement/SecurityRequirement';
+import { SECTION_ATTR } from '../../services';
 
 const Description = styled.div`
   margin-bottom: ${({ theme }) => theme.spacing.unit * 6}px;
@@ -37,7 +38,7 @@ export class Operation extends React.Component<OperationProps> {
     return (
       <OptionsContext.Consumer>
         {options => (
-          <Row>
+          <Row {...{ [SECTION_ATTR]: operation.operationHash }} id={operation.operationHash}>
             <MiddlePanel>
               <H2>
                 <ShareLink to={operation.id} />
diff --git a/src/services/models/Operation.ts b/src/services/models/Operation.ts
index be9c683b03..502846f35a 100644
--- a/src/services/models/Operation.ts
+++ b/src/services/models/Operation.ts
@@ -70,6 +70,7 @@ export class OperationModel implements IMenuItem {
 
   pointer: string;
   operationId?: string;
+  operationHash?: string;
   httpVerb: string;
   deprecated: boolean;
   path: string;
@@ -123,9 +124,10 @@ export class OperationModel implements IMenuItem {
       // TODO: update getting pathInfo for overriding servers on path level
       this.servers = normalizeServers('', operationSpec.servers || operationSpec.pathServers || []);
     } else {
+      this.operationHash = operationSpec.operationId && 'operation/' + operationSpec.operationId
       this.id =
         operationSpec.operationId !== undefined
-          ? 'operation/' + operationSpec.operationId
+          ? (parent ? parent.id + '/' : '') + this.operationHash
           : parent !== undefined
           ? parent.id + this.pointer
           : this.pointer;