fix(sqllab): preserve saved query description when editing (#41685)

(cherry picked from commit de5a233ccf)

superset-frontend/src/SqlLab/actions/sqlLab.js

@@ -1245,6 +1245,7 @@ export function popSavedQuery(saveQueryId) {
         };
         const tmpAdaptedProps = {
           name: queryEditorProps.name,
+          description: queryEditorProps.description,
           dbId: queryEditorProps.database.id,
           catalog: queryEditorProps.catalog,
           schema: queryEditorProps.schema,

superset-frontend/src/SqlLab/actions/sqlLab.test.js

@@ -670,7 +670,7 @@ describe('async actions', () => {
         database_name: 'examples',
         id: 2,
       },
-      description: '',
+      description: 'A saved query description',
       id: 1,
       label: 'Query 1',
       schema: 'public',
@@ -720,6 +720,7 @@ describe('async actions', () => {
 
       const expectedParams = {
         name: 'Query 1',
+        description: 'A saved query description',
         dbId: 2,
         catalog: null,
         schema: 'public',

superset-frontend/src/SqlLab/components/SaveQuery/SaveQuery.test.tsx

@@ -171,6 +171,47 @@ describe('SavedQuery', () => {
     expect(updateBtn).toBeInTheDocument();
   });
 
+  test('pre-fills the description from an existing saved query and updates with it unchanged', async () => {
+    const storedDescription = 'This is the stored description';
+    const mockOnUpdate = jest.fn();
+
+    render(<SaveQuery {...mockedProps} onUpdate={mockOnUpdate} />, {
+      useRedux: true,
+      store: mockStore({
+        ...mockState,
+        sqlLab: {
+          ...mockState.sqlLab,
+          queryEditors: [
+            {
+              id: mockedProps.queryEditorId,
+              dbId: 1,
+              catalog: null,
+              schema: 'main',
+              sql: 'SELECT * FROM t',
+              name: 'My saved query',
+              description: storedDescription,
+              remoteId: 42,
+            },
+          ],
+        },
+      }),
+    });
+
+    userEvent.click(screen.getByRole('button', { name: /save/i }));
+
+    const descriptionTextbox = screen.getByRole('textbox', {
+      name: 'Description',
+    });
+    expect(descriptionTextbox).toHaveValue(storedDescription);
+
+    userEvent.click(screen.getByRole('button', { name: /update/i }));
+
+    await waitFor(() => expect(mockOnUpdate).toHaveBeenCalled());
+    expect(mockOnUpdate.mock.calls[0][0]).toEqual(
+      expect.objectContaining({ description: storedDescription }),
+    );
+  });
+
   it('renders a split save button when allows_virtual_table_explore is enabled', async () => {
     render(<SaveQuery {...splitSaveBtnProps} />, {
       useRedux: true,

superset-frontend/src/SqlLab/components/SaveQuery/index.tsx

@@ -171,16 +171,22 @@ const SaveQuery = ({
     <Form layout="vertical">
       <Row>
         <Col xs={24}>
-          <FormItem label={t('Name')}>
-            <Input type="text" value={label} onChange={onLabelChange} />
+          <FormItem label={t('Name')} htmlFor="save-query-name">
+            <Input
+              id="save-query-name"
+              type="text"
+              value={label}
+              onChange={onLabelChange}
+            />
           </FormItem>
         </Col>
       </Row>
       <br />
       <Row>
         <Col xs={24}>
-          <FormItem label={t('Description')}>
+          <FormItem label={t('Description')} htmlFor="save-query-description">
             <Input.TextArea
+              id="save-query-description"
               rows={4}
               value={description}
               onChange={onDescriptionChange}