Remove default line-height from mj-text

GrapesJS · Aug 21, 2024 · 96e81a6 · 96e81a6
1 parent 4992ec8
commit 96e81a6
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 17 deletions.
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,10 @@
+{
+  "endOfLine": "lf",
+  "insertPragma": false,
+  "requirePragma": false,
+  "trailingComma": "all",
+  "tabWidth": 2,
+  "useTabs": false,
+  "singleQuote": true,
+  "printWidth": 120
+}
diff --git a/src/components/Text.ts b/src/components/Text.ts
@@ -20,19 +20,31 @@ export default (editor: Editor, { coreMjmlModel, coreMjmlView }: ComponentPlugin
         draggable: componentsToQuery([typeColumn, typeHero]),
         highlightable: false,
         stylable: [
-          'height', 'font-style', 'font-size', 'font-weight', 'font-family', 'color',
-          'line-height', 'letter-spacing', 'text-decoration', 'align', 'text-transform',
-          'padding', 'padding-top', 'padding-left', 'padding-right', 'padding-bottom',
-          'container-background-color'
+          'height',
+          'font-style',
+          'font-size',
+          'font-weight',
+          'font-family',
+          'color',
+          'line-height',
+          'letter-spacing',
+          'text-decoration',
+          'align',
+          'text-transform',
+          'padding',
+          'padding-top',
+          'padding-left',
+          'padding-right',
+          'padding-bottom',
+          'container-background-color',
         ],
         'style-default': {
           'padding-top': '10px',
           'padding-bottom': '10px',
           'padding-right': '25px',
           'padding-left': '25px',
           'font-size': '13px',
-          'line-height': '22px',
-          'align': 'left',
+          align: 'left',
         },
       },
     },

diff --git a/tests/specs/issue-367.test.ts b/tests/specs/issue-367.test.ts
@@ -1,5 +1,5 @@
-import grapesjs, { Editor } from "grapesjs";
-import grapesJSMJML from "../../src";
+import grapesjs, { Editor } from 'grapesjs';
+import grapesJSMJML from '../../src';
 
 const rawMjml = `
     <mjml>
@@ -25,29 +25,29 @@ const rawMjml = `
 `;
 
 // https://github.com/GrapesJS/mjml/issues/367
-describe("Line Height", () => {
+describe('Line Height', () => {
   let editor: Editor;
 
   beforeEach((done) => {
     const e = grapesjs.init({
-      container: "#gjs",
+      container: '#gjs',
       plugins: [grapesJSMJML],
     });
     editor = e;
 
     editor.getModel().loadOnStart();
-    editor.on("change:readyLoad", () => done());
+    editor.on('change:readyLoad', () => done());
   });
 
   afterEach(() => {
     editor.destroy();
   });
 
-  test("Editor exists", () => {
+  test('Editor exists', () => {
     expect(editor).toBeTruthy();
   });
 
-  test("should expect default line height as 22px and export correctly in html", () => {
+  test('should expect default line height as 22px and export correctly in html', () => {
     editor.addComponents(rawMjml);
 
     const mjmlComponent = editor.getComponents().at(0);
@@ -56,11 +56,10 @@ describe("Line Height", () => {
     const mjmlColumn = mjmlSection.components().at(0);
     const mjmlText = mjmlColumn.components().at(0);
 
-    const defaultLineHeight = "22px";
-    const lineHeight = mjmlText.getAttributes()["line-height"];
-    expect(lineHeight).toBe(defaultLineHeight);
+    const lineHeight = mjmlText.getAttributes()['line-height'];
+    expect(lineHeight).toBe(undefined);
 
-    const { errors, html } = editor.Commands.run("mjml-code-to-html");
+    const { errors, html } = editor.Commands.run('mjml-code-to-html');
 
     expect(errors).toHaveLength(0);
     expect(html).toMatchSnapshot();