Expand all debugger errors by default

app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Debugger/Logs_spec.js

@@ -24,7 +24,15 @@ describe("Debugger logs", function() {
     cy.get(commonlocators.homeIcon).click({ force: true });
     cy.generateUUID().then((id) => {
       cy.CreateAppInFirstListedOrg(id);
-      cy.contains(debuggerLocators.debuggerIcon, 0);
+      cy.get(debuggerLocators.errorCount).should("not.exist");
     });
   });
+
+  it("Api headers need to be shown as headers in logs", function() {
+    // TODO
+  });
+
+  it("Api body needs to be shown as JSON when possible", function() {
+    // TODO
+  });
 });

app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Debugger/PageOnLoad_spec.js

@@ -18,6 +18,6 @@ describe("Check debugger logs state when there are onPageLoad actions", function
     cy.get(explorer.addWidget).click();
 
     cy.reload();
-    cy.contains(debuggerLocators.debuggerIcon, 0);
+    cy.get(debuggerLocators.errorCount).should("not.exist");
   });
 });

app/client/cypress/integration/Smoke_TestSuite/ClientSideTests/Debugger/Widget_Error_spec.js

@@ -22,4 +22,12 @@ describe("Widget error state", function() {
 
     cy.get(debuggerLocators.debuggerLogState).contains("Test");
   });
+
+  it("All errors should be expanded by default", function() {
+    cy.testJsontext("label", "{{[]}}");
+
+    cy.get(".t--debugger-message")
+      .should("be.visible")
+      .should("have.length", 2);
+  });
 });

app/client/cypress/locators/Debugger.json

@@ -1,4 +1,5 @@
 {
     "debuggerIcon": ".t--debugger",
-    "debuggerLogState": ".t--debugger-log-state"
+    "debuggerLogState": ".t--debugger-log-state",
+    "errorCount": ".t--debugger-count"
 }

app/client/src/components/editorComponents/Debugger/Errors.tsx

@@ -6,7 +6,6 @@ import LogItem, { getLogItemProps } from "./LogItem";
 import { BlankState } from "./helpers";
 import { createMessage, NO_ERRORS } from "constants/messages";
 import { getCurrentUser } from "selectors/usersSelectors";
-import { AppState } from "reducers";
 import { bootIntercom } from "utils/helpers";
 
 const ContainerWrapper = styled.div`
@@ -21,7 +20,6 @@ const ListWrapper = styled.div`
 
 function Errors(props: { hasShortCut?: boolean }) {
   const errors = useSelector(getDebuggerErrors);
-  const expandId = useSelector((state: AppState) => state.ui.debugger.expandId);
   const currentUser = useSelector(getCurrentUser);
 
   useEffect(() => {
@@ -39,14 +37,9 @@ function Errors(props: { hasShortCut?: boolean }) {
         ) : (
           Object.values(errors).map((e, index) => {
             const logItemProps = getLogItemProps(e);
-            const id = Object.keys(errors)[index];
-
+            // Expand all errors by default
             return (
-              <LogItem
-                key={`debugger-${index}`}
-                {...logItemProps}
-                expand={id === expandId}
-              />
+              <LogItem key={`debugger-${index}`} {...logItemProps} expand />
             );
           })
         )}

app/client/src/components/editorComponents/Debugger/LogItem.tsx

@@ -290,7 +290,7 @@ function LogItem(props: LogItemProps) {
               return (
                 <MessageWrapper key={e.message}>
                   <span
-                    className="debugger-message"
+                    className="debugger-message t--debugger-message"
                     onClick={(event) => onLogClick(event, e)}
                   >
                     {e.message}

app/client/src/components/editorComponents/Debugger/index.tsx

@@ -78,7 +78,9 @@ function Debugger() {
         onClick={onClick}
       >
         <Icon name="bug" size={IconSize.XL} />
-        <div className="debugger-count">{errorCount}</div>
+        {!!errorCount && (
+          <div className="debugger-count t--debugger-count">{errorCount}</div>
+        )}
       </Container>
     );
   return <DebuggerTabs defaultIndex={errorCount ? 0 : 1} />;