Merge remote-tracking branch 'upstream/main'

usebruno · Jan 3, 2025 · e4b9759 · e4b9759
2 parents 9e00ab2 + 52672e6
commit e4b9759
Show file tree

Hide file tree

Showing 42 changed files with 1,081 additions and 466 deletions.
diff --git a/.github/workflows/npm-bru-cli.yml b/.github/workflows/npm-bru-cli.yml
@@ -2,6 +2,11 @@ name: Bru CLI Tests (npm)
 
 on:
   workflow_dispatch:
+    inputs:
+      build:
+        description: 'Test Bru CLI (npm)'
+        required: true
+        default: 'true'
 
 # Assign permissions for unit tests to be reported.
 # See https://github.com/dorny/test-reporter/issues/168

diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/bruno-app/package.json b/packages/bruno-app/package.json
@@ -35,20 +35,20 @@
     "graphql": "^16.6.0",
     "graphql-request": "^3.7.0",
     "httpsnippet": "^3.0.6",
-    "i18next": "^23.14.0",
+    "i18next": "24.1.2",
     "idb": "^7.0.0",
     "immer": "^9.0.15",
     "jsesc": "^3.0.2",
     "jshint": "^2.13.6",
     "json5": "^2.2.3",
     "jsonc-parser": "^3.2.1",
-    "jsonpath-plus": "10.1.0",
+    "jsonpath-plus": "10.2.0",
     "know-your-http-well": "^0.5.0",
     "lodash": "^4.17.21",
     "markdown-it": "^13.0.2",
     "markdown-it-replace-link": "^1.2.0",
     "mousetrap": "^1.6.5",
-    "nanoid": "3.3.4",
+    "nanoid": "3.3.8",
     "path": "^0.12.7",
     "pdfjs-dist": "4.4.168",
     "platform": "^1.3.6",

diff --git a/packages/bruno-app/src/components/CodeEditor/index.js b/packages/bruno-app/src/components/CodeEditor/index.js
@@ -76,7 +76,11 @@ if (!SERVER_RENDERED) {
     'bru.getRequestVar(key)',
     'bru.sleep(ms)',
     'bru.getGlobalEnvVar(key)',
-    'bru.setGlobalEnvVar(key, value)'
+    'bru.setGlobalEnvVar(key, value)',
+    'bru.runner',
+    'bru.runner.setNextRequest(requestName)',
+    'bru.runner.skipRequest()',
+    'bru.runner.stopExecution()'
   ];
   CodeMirror.registerHelper('hint', 'brunoJS', (editor, options) => {
     const cursor = editor.getCursor();
@@ -98,7 +102,7 @@ if (!SERVER_RENDERED) {
     if (curWordBru) {
       hintWords.forEach((h) => {
         if (h.includes('.') == curWordBru.includes('.') && h.startsWith(curWordBru)) {
-          result.list.push(curWordBru.includes('.') ? h.split('.')[1] : h);
+          result.list.push(curWordBru.includes('.') ? h.split('.')?.at(-1) : h);
         }
       });
       result.list?.sort();

diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSelector/index.js
@@ -19,7 +19,7 @@ const EnvironmentSelector = ({ collection }) => {
   const Icon = forwardRef((props, ref) => {
     return (
       <div ref={ref} className="current-environment flex items-center justify-center pl-3 pr-2 py-1 select-none">
-        {activeEnvironment ? activeEnvironment.name : 'No Environment'}
+        <p className="text-nowrap truncate max-w-32">{activeEnvironment ? activeEnvironment.name : 'No Environment'}</p>
         <IconCaretDown className="caret" size={14} strokeWidth={2} />
       </div>
     );

diff --git a/...runo-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js b/...runo-app/src/components/Environments/EnvironmentSettings/EnvironmentList/StyledWrapper.js
@@ -23,6 +23,10 @@ const StyledWrapper = styled.div`
     padding: 8px 10px;
     border-left: solid 2px transparent;
     text-decoration: none;
+    max-width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 
     &:hover {
       text-decoration: none;

diff --git a/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js b/packages/bruno-app/src/components/Environments/EnvironmentSettings/EnvironmentList/index.js
@@ -8,6 +8,7 @@ import ImportEnvironment from '../ImportEnvironment';
 import ManageSecrets from '../ManageSecrets';
 import StyledWrapper from './StyledWrapper';
 import ConfirmSwitchEnv from './ConfirmSwitchEnv';
+import ToolHint from 'components/ToolHint';
 
 const EnvironmentList = ({ selectedEnvironment, setSelectedEnvironment, collection, isModified, setIsModified }) => {
   const { environments } = collection;
@@ -103,13 +104,15 @@ const EnvironmentList = ({ selectedEnvironment, setSelectedEnvironment, collecti
             {environments &&
               environments.length &&
               environments.map((env) => (
-                <div
-                  key={env.uid}
-                  className={selectedEnvironment.uid === env.uid ? 'environment-item active' : 'environment-item'}
-                  onClick={() => handleEnvironmentClick(env)} // Use handleEnvironmentClick to handle clicks
-                >
-                  <span className="break-all">{env.name}</span>
-                </div>
+                <ToolHint key={env.uid} text={env.name} toolhintId={env.uid} place="right">
+                  <div
+                    id={env.uid}
+                    className={selectedEnvironment.uid === env.uid ? 'environment-item active' : 'environment-item'}
+                    onClick={() => handleEnvironmentClick(env)} // Use handleEnvironmentClick to handle clicks
+                  >
+                      <span className="break-all">{env.name}</span>
+                  </div>
+                </ToolHint>
               ))}
             <div className="btn-create-environment" onClick={() => handleCreateEnvClick()}>
               + <span>Create</span>

diff --git a/packages/bruno-app/src/components/GlobalEnvironments/EnvironmentSelector/index.js b/packages/bruno-app/src/components/GlobalEnvironments/EnvironmentSelector/index.js
@@ -23,7 +23,7 @@ const EnvironmentSelector = () => {
           <ToolHint text="Global Environments" toolhintId="GlobalEnvironmentsToolhintId" className='flex flex-row'>
             <IconWorld className="globe" size={16} strokeWidth={1.5} />
             {
-              activeEnvironment ? <div>{activeEnvironment?.name}</div> : null
+              activeEnvironment ? <div className='text-nowrap truncate max-w-32'>{activeEnvironment?.name}</div> : null
             }
           </ToolHint>
         </div>

diff --git a/...pp/src/components/GlobalEnvironments/EnvironmentSettings/EnvironmentList/StyledWrapper.js b/...pp/src/components/GlobalEnvironments/EnvironmentSettings/EnvironmentList/StyledWrapper.js
@@ -23,6 +23,10 @@ const StyledWrapper = styled.div`
     padding: 8px 10px;
     border-left: solid 2px transparent;
     text-decoration: none;
+    max-width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 
     &:hover {
       text-decoration: none;

diff --git a/.../bruno-app/src/components/GlobalEnvironments/EnvironmentSettings/EnvironmentList/index.js b/.../bruno-app/src/components/GlobalEnvironments/EnvironmentSettings/EnvironmentList/index.js
@@ -8,6 +8,7 @@ import ConfirmSwitchEnv from './ConfirmSwitchEnv';
 import ManageSecrets from 'components/Environments/EnvironmentSettings/ManageSecrets/index';
 import ImportEnvironment from '../ImportEnvironment';
 import { isEqual } from 'lodash';
+import ToolHint from 'components/ToolHint/index';
 
 const EnvironmentList = ({ environments, activeEnvironmentUid, selectedEnvironment, setSelectedEnvironment, isModified, setIsModified }) => {
   const [openCreateModal, setOpenCreateModal] = useState(false);
@@ -112,13 +113,15 @@ const EnvironmentList = ({ environments, activeEnvironmentUid, selectedEnvironme
             {environments &&
               environments.length &&
               environments.map((env) => (
-                <div
-                  key={env.uid}
-                  className={selectedEnvironment.uid === env.uid ? 'environment-item active' : 'environment-item'}
-                  onClick={() => handleEnvironmentClick(env)} // Use handleEnvironmentClick to handle clicks
-                >
-                  <span className="break-all">{env.name}</span>
-                </div>
+                <ToolHint key={env.uid} text={env.name} toolhintId={env.uid} place="right">
+                  <div
+                    id={env.uid}
+                    className={selectedEnvironment.uid === env.uid ? 'environment-item active' : 'environment-item'}
+                    onClick={() => handleEnvironmentClick(env)} // Use handleEnvironmentClick to handle click
+                  >
+                      <span className="break-all">{env.name}</span>
+                  </div>
+                </ToolHint>
               ))}
             <div className="btn-create-environment" onClick={() => handleCreateEnvClick()}>
               + <span>Create</span>

diff --git a/packages/bruno-app/src/components/RequestPane/Assertions/AssertionRow/index.js b/packages/bruno-app/src/components/RequestPane/Assertions/AssertionRow/index.js
@@ -90,7 +90,7 @@ const parseAssertionOperator = (str = '') => {
     'isArray'
   ];
 
-  const [operator, ...rest] = str.trim().split(' ');
+  const [operator, ...rest] = str.split(' ');
   const value = rest.join(' ');
 
   if (unaryOperators.includes(operator)) {
@@ -166,7 +166,7 @@ const AssertionRow = ({
             handleAssertionChange(
               {
                 target: {
-                  value: `${op} ${value}`
+                  value: isUnaryOperator(op) ? op : `${op} ${value}`
                 }
               },
               assertion,
@@ -182,7 +182,7 @@ const AssertionRow = ({
             theme={storedTheme}
             readOnly={true}
             onSave={onSave}
-            onChange={(newValue) =>
+            onChange={(newValue) => {
               handleAssertionChange(
                 {
                   target: {
@@ -192,6 +192,7 @@ const AssertionRow = ({
                 assertion,
                 'value'
               )
+              }
             }
             onRun={handleRun}
             collection={collection}

diff --git a/packages/bruno-app/src/components/RequestPane/QueryParams/index.js b/packages/bruno-app/src/components/RequestPane/QueryParams/index.js
@@ -117,7 +117,6 @@ const QueryParams = ({ item, collection }) => {
     <StyledWrapper className="w-full flex flex-col absolute">
       <div className="flex-1 mt-2">
         <div className="mb-1 title text-xs">Query</div>
-
         <Table
           headers={[
             { name: 'Name', accessor: 'name', width: '31%' },
@@ -153,7 +152,7 @@ const QueryParams = ({ item, collection }) => {
                       />
                     </td>
                     <td>
-                      <div className="flex items-center">
+                      <div className="flex items-center justify-center">
                         <input
                           type="checkbox"
                           checked={param.enabled}
@@ -188,7 +187,7 @@ const QueryParams = ({ item, collection }) => {
               </code>
             </div>
           `}
-          infotipId="path-param-InfoTip"
+            infotipId="path-param-InfoTip"
           />
         </div>
         <table>
@@ -241,11 +240,7 @@ const QueryParams = ({ item, collection }) => {
               : null}
           </tbody>
         </table>
-        {!(pathParams && pathParams.length) ?
-          <div className="title pr-2 py-3 mt-2 text-xs">
-
-          </div>
-        : null}
+        {!(pathParams && pathParams.length) ? <div className="title pr-2 py-3 mt-2 text-xs"></div> : null}
       </div>
     </StyledWrapper>
   );

diff --git a/packages/bruno-app/src/components/RequestTabPanel/index.js b/packages/bruno-app/src/components/RequestTabPanel/index.js
@@ -39,12 +39,15 @@ const RequestTabPanel = () => {
   const _collections = useSelector((state) => state.collections.collections);
 
   // merge `globalEnvironmentVariables` into the active collection and rebuild `collections` immer proxy object
-  let collections = produce(_collections, draft => {
+  let collections = produce(_collections, (draft) => {
     let collection = find(draft, (c) => c.uid === focusedTab?.collectionUid);
 
     if (collection) {
       // add selected global env variables to the collection object
-      const globalEnvironmentVariables = getGlobalEnvironmentVariables({ globalEnvironments, activeGlobalEnvironmentUid });
+      const globalEnvironmentVariables = getGlobalEnvironmentVariables({
+        globalEnvironments,
+        activeGlobalEnvironmentUid
+      });
       const globalEnvSecrets = getGlobalEnvironmentVariablesMasked({ globalEnvironments, activeGlobalEnvironmentUid });
       collection.globalEnvironmentVariables = globalEnvironmentVariables;
       collection.globalEnvSecrets = globalEnvSecrets;

diff --git a/packages/bruno-app/src/components/ResponsePane/ResponseSave/index.js b/packages/bruno-app/src/components/ResponsePane/ResponseSave/index.js
@@ -11,7 +11,7 @@ const ResponseSave = ({ item }) => {
   const saveResponseToFile = () => {
     return new Promise((resolve, reject) => {
       ipcRenderer
-        .invoke('renderer:save-response-to-file', response, item.requestSent.url)
+        .invoke('renderer:save-response-to-file', response, item?.requestSent?.url)
         .then(resolve)
         .catch((err) => {
           toast.error(get(err, 'error.message') || 'Something went wrong!');

diff --git a/packages/bruno-app/src/components/ResponsePane/Timeline/index.js b/packages/bruno-app/src/components/ResponsePane/Timeline/index.js
@@ -43,7 +43,7 @@ const Timeline = ({ request, response }) => {
 
       <div className="mt-4">
         <pre className="line response font-bold">
-          <span className="arrow">{'<'}</span> {response.status} {response.statusText}
+          <span className="arrow">{'<'}</span> {response.status} - {response.statusText}
         </pre>
 
         {responseHeaders.map((h) => {

diff --git a/packages/bruno-app/src/components/RunnerResults/index.jsx b/packages/bruno-app/src/components/RunnerResults/index.jsx
@@ -59,7 +59,7 @@ export default function RunnerResults({ collection }) {
         pathname: info.pathname,
         relativePath: getRelativePath(collection.pathname, info.pathname)
       };
-      if (newItem.status !== 'error') {
+      if (newItem.status !== 'error' && newItem.status !== 'skipped') {
         if (newItem.testResults) {
           const failed = newItem.testResults.filter((result) => result.status === 'fail');
           newItem.testStatus = failed.length ? 'fail' : 'pass';
@@ -163,29 +163,35 @@ export default function RunnerResults({ collection }) {
           <div className="pb-2 font-medium test-summary">
             Total Requests: {items.length}, Passed: {passedRequests.length}, Failed: {failedRequests.length}
           </div>
+          {runnerInfo?.statusText ? 
+            <div className="pb-2 font-medium danger">
+              {runnerInfo?.statusText}
+            </div>
+          : null}
           {items.map((item) => {
             return (
               <div key={item.uid}>
                 <div className="item-path mt-2">
                   <div className="flex items-center">
                     <span>
-                      {item.status !== 'error' && item.testStatus === 'pass' ? (
+                      {item.status !== 'error' && item.testStatus === 'pass' && item.status !== 'skipped' ? (
                         <IconCircleCheck className="test-success" size={20} strokeWidth={1.5} />
                       ) : (
                         <IconCircleX className="test-failure" size={20} strokeWidth={1.5} />
                       )}
                     </span>
                     <span
-                      className={`mr-1 ml-2 ${item.status == 'error' || item.testStatus == 'fail' ? 'danger' : ''}`}
+                      className={`mr-1 ml-2 ${item.status == 'error' || item.status == 'skipped' || item.testStatus == 'fail' ? 'danger' : ''}`}
                     >
                       {item.relativePath}
                     </span>
-                    {item.status !== 'error' && item.status !== 'completed' ? (
+                    {item.status !== 'error' && item.status !== 'skipped' && item.status !== 'completed' ? (
                       <IconRefresh className="animate-spin ml-1" size={18} strokeWidth={1.5} />
                     ) : item.responseReceived?.status ? (
                       <span className="text-xs link cursor-pointer" onClick={() => setSelectedItem(item)}>
-                        (<span className="mr-1">{item.responseReceived?.status}</span>
-                        <span>{item.responseReceived?.statusText}</span>)
+                        <span className="mr-1">{item.responseReceived?.status}</span>
+                        -&nbsp;
+                        <span>{item.responseReceived?.statusText}</span>
                       </span>
                     ) : (
                       <span className="danger text-xs cursor-pointer" onClick={() => setSelectedItem(item)}>

diff --git a/...omponents/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/StyledWrapper.js b/...omponents/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/StyledWrapper.js
@@ -35,6 +35,28 @@ const StyledWrapper = styled.div`
       background-color: ${(props) => props.theme.collection.environment.settings.item.active.hoverBg} !important;
     }
   }
+
+  .flexible-container {
+    width: 100%;
+  }
+
+  @media (max-width: 600px) {
+    .flexible-container {
+      width: 500px;
+    }
+  }
+
+  @media (min-width: 601px) and (max-width: 1200px) {
+    .flexible-container {
+      width: 800px;
+    }
+  }
+
+  @media (min-width: 1201px) {
+    .flexible-container {
+      width: 900px;
+    }
+  }
 `;
 
 export default StyledWrapper;
diff --git a/...pp/src/components/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/index.js b/...pp/src/components/Sidebar/Collections/Collection/CollectionItem/GenerateCodeItem/index.js
@@ -48,7 +48,7 @@ const GenerateCodeItem = ({ collection, item, onClose }) => {
   return (
     <Modal size="lg" title="Generate Code" handleCancel={onClose} hideFooter={true}>
       <StyledWrapper>
-        <div className="flex w-full">
+        <div className="flex w-full flexible-container">
           <div>
             <div className="generate-code-sidebar">
               {languages &&
@@ -59,7 +59,27 @@ const GenerateCodeItem = ({ collection, item, onClose }) => {
                     className={
                       language.name === selectedLanguage.name ? 'generate-code-item active' : 'generate-code-item'
                     }
+                    role="button"
+                    tabIndex={0}
                     onClick={() => setSelectedLanguage(language)}
+                    onKeyDown={(e) => {
+                      if (e.key === 'Tab') {
+                        e.preventDefault();
+                        const currentIndex = languages.findIndex((lang) => lang.name === selectedLanguage.name);
+                        const nextIndex = e.shiftKey
+                          ? (currentIndex - 1 + languages.length) % languages.length
+                          : (currentIndex + 1) % languages.length;
+                        setSelectedLanguage(languages[nextIndex]);
+                      }
+
+                      if (e.shiftKey && e.key === 'Tab') {
+                        e.preventDefault();
+                        const currentIndex = languages.findIndex((lang) => lang.name === selectedLanguage.name);
+                        const nextIndex = (currentIndex - 1 + languages.length) % languages.length;
+                        setSelectedLanguage(languages[nextIndex]);
+                      }
+                    }}
+                    aria-pressed={language.name === selectedLanguage.name}
                   >
                     <span className="capitalize">{language.name}</span>
                   </div>