feat: change monaco shortcut (#45627)

* feat: change monaco shortcut

* fix: oops I lost the eslint-enable comment

* feat(tests): add cypress tests

client/src/templates/Challenges/classic/editor.tsx

@@ -379,6 +379,21 @@ const Editor = (props: EditorProps): JSX.Element => {
       null,
       () => {}
     );
+    const newLine = editor.getAction('editor.action.insertLineAfter');
+    // @ts-ignore
+    editor._standaloneKeybindingService.addDynamicKeybinding(
+      '-editor.action.insertLineAfter',
+      null,
+      () => {}
+    );
+    // @ts-ignore
+    editor._standaloneKeybindingService.addDynamicKeybinding(
+      'editor.action.insertLineAfter',
+      monaco.KeyMod.Alt | monaco.KeyCode.Enter,
+      () => {
+        newLine.run();
+      }
+    );
     /* eslint-enable */
     editor.addAction({
       id: 'execute-challenge',

cypress/integration/learn/common-components/editor.js

@@ -0,0 +1,29 @@
+const selectors = {
+  editor: '.monaco-editor'
+};
+
+describe('Editor Shortcuts', () => {
+  it('Should handle Alt+Enter', () => {
+    cy.visit(
+      'learn/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements'
+    );
+    cy.get(selectors.editor, { timeout: 15000 })
+      .first()
+      .click()
+      .focused()
+      .type('{alt}{enter}')
+      .should('have.value', '<h1>Hello</h1>\n');
+  });
+
+  it('Should ignore Ctrl+Enter', () => {
+    cy.visit(
+      'learn/responsive-web-design/basic-html-and-html5/say-hello-to-html-elements'
+    );
+    cy.get(selectors.editor, { timeout: 15000 })
+      .first()
+      .click()
+      .focused()
+      .type('{ctrl}{enter}')
+      .should('have.value', '<h1>Hello</h1>');
+  });
+});