fix: Response objects couldn't open (#1867)

* This was undefined on response toggle

* Add test cases for opening response object

e2e/integration/menu.e2e.ts

@@ -4,9 +4,7 @@ describe('Menu', () => {
   });
 
   it('should have valid items count', () => {
-    cy.get('.menu-content')
-      .find('li')
-      .should('have.length', 34);
+    cy.get('.menu-content').find('li').should('have.length', 34);
   });
 
   it('should sync active menu items while scroll', () => {
@@ -35,9 +33,7 @@ describe('Menu', () => {
       .should('have.text', 'Add a new pet to the store')
       .should('be.visible');
 
-    cy.contains('h1', 'Swagger Petstore')
-      .scrollIntoView()
-      .wait(100)
+    cy.contains('h1', 'Swagger Petstore').scrollIntoView().wait(100);
 
     cy.contains('h1', 'Introduction')
       .scrollIntoView()
@@ -59,10 +55,25 @@ describe('Menu', () => {
   it('should deactivate tag when other is activated', () => {
     const petItem = () => cy.contains('[role=menuitem].-depth1', 'pet');
 
-    petItem()
-      .click({ force: true })
-      .should('have.class', 'active');
+    petItem().click({ force: true }).should('have.class', 'active');
     cy.contains('[role=menuitem].-depth1', 'store').click({ force: true });
     petItem().should('not.have.class', 'active');
   });
+
+  it('should be able to open a response object to see more details', () => {
+    cy.contains('h2', 'Find pet by ID')
+      .scrollIntoView()
+      .wait(100)
+      .parent()
+      .find('div h3')
+      .should('have.text', 'Responses')
+      .parent()
+      .find('div:first button')
+      .click()
+      .should('have.attr', 'aria-expanded', 'true')
+      .parent()
+      .find('div h5')
+      .then($h5 => $h5[0].firstChild!.nodeValue!.trim())
+      .should('eq', 'Response Schema:');
+  });
 });

src/components/Responses/Response.tsx

@@ -30,7 +30,7 @@ export const ResponseView = observer(({ response }: ResponseViewProps): React.Re
   return (
     <div>
       <StyledResponseTitle
-        onClick={response.toggle}
+        onClick={() => response.toggle()}
         type={type}
         empty={empty}
         title={summary || ''}