fix: Undefined variable sizeModificated & styling

Executed yarn link to add the new max line width of 120.

.github/workflows/deploy-staging.yml

@@ -116,16 +116,7 @@ jobs:
       fail-fast: false
       matrix:
         branch: ${{ fromJson(needs.prepare.outputs.branches) }}
-        editor:
-          [
-            "ckeditor4",
-            "ckeditor5",
-            "froala",
-            "generic",
-            "tinymce5",
-            "tinymce6",
-            "viewer",
-          ]
+        editor: ["ckeditor4", "ckeditor5", "froala", "generic", "tinymce5", "tinymce6", "viewer"]
         framework: ["html", "vue"]
         exclude:
           - framework: vue

.prettierrc

@@ -1,4 +1,5 @@
 {
   "singleQuote": false,
-  "tabWidth": 2
+  "tabWidth": 2,
+  "printWidth": 120
 }

cypress/support/commands.d.ts

@@ -99,10 +99,7 @@ declare namespace Cypress {
      * @param subject the formula to apply this command to
      * @param coordinates place to drop the formula
      */
-    dragDropFormula(
-      subject: Element,
-      coordinates: { x: number; y: number },
-    ): Chainable;
+    dragDropFormula(subject: Element, coordinates: { x: number; y: number }): Chainable;
 
     /**
      * Not yet implemented.

cypress/support/commands.js

@@ -55,26 +55,21 @@ Cypress.Commands.add("clickModalButton", (button) => {
       cy.get(".wrs_handWrapper > input").click();
       break;
     default:
-      throw new Error(
-        `The button '${button}' does not exist. Check the clickModalButton documentation.`,
-      );
+      throw new Error(`The button '${button}' does not exist. Check the clickModalButton documentation.`);
   }
 });
 
 // eslint-disable-next-line no-unused-vars
-Cypress.Commands.add(
-  "insertFormulaFromScratch",
-  (formula, chem = false, paste = false) => {
-    // Open the mathtype modal
-    cy.clickButtonToOpenModal(chem);
+Cypress.Commands.add("insertFormulaFromScratch", (formula, chem = false, paste = false) => {
+  // Open the mathtype modal
+  cy.clickButtonToOpenModal(chem);
 
-    // Type the formula that matxes the previous inserted text on the mathtype modal
-    cy.typeInModal(formula);
+  // Type the formula that matxes the previous inserted text on the mathtype modal
+  cy.typeInModal(formula);
 
-    // Insert the formula
-    cy.clickModalButton("insert");
-  },
-);
+  // Insert the formula
+  cy.clickModalButton("insert");
+});
 
 Cypress.Commands.add("getFormula", (formulaId) => {
   cy.get(".Wirisformula")
@@ -100,27 +95,15 @@ Cypress.Commands.add("selectLatexFormula", (formulaId) => {
       const caracter = html[i];
       if (caracter === "$" && prevDolar === false && waitEndDolar === false) {
         prevDolar = true;
-      } else if (
-        caracter === "$" &&
-        prevDolar === true &&
-        waitEndDolar === false
-      ) {
+      } else if (caracter === "$" && prevDolar === true && waitEndDolar === false) {
         prevDolar = false;
         waitEndDolar = true;
         if (countFormula === formulaId) startOffset = i + 1;
-      } else if (
-        caracter === "$" &&
-        prevDolar === false &&
-        waitEndDolar === true
-      ) {
+      } else if (caracter === "$" && prevDolar === false && waitEndDolar === true) {
         prevDolar = true;
         if (countFormula === formulaId) endOffset = i;
         else countFormula += 1;
-      } else if (
-        caracter === "$" &&
-        prevDolar === true &&
-        waitEndDolar === true
-      ) {
+      } else if (caracter === "$" && prevDolar === true && waitEndDolar === true) {
         prevDolar = false;
         waitEndDolar = false;
       }

cypress/support/validations.js

@@ -1,8 +1,4 @@
 // eslint-disable-next-line no-unused-vars
-Cypress.Commands.add(
-  "isRendered",
-  { prevSubject: "element" },
-  (subject, preview = false) => {
-    cy.wrap(subject).should("be.visible");
-  },
-);
+Cypress.Commands.add("isRendered", { prevSubject: "element" }, (subject, preview = false) => {
+  cy.wrap(subject).should("be.visible");
+});

cypress/tests/smoke/STD-001.insertion.js

@@ -25,7 +25,5 @@ it("an inserted formula that looks like plain text should be aligned with the sa
   cy.insertFormulaFromScratch(this.formulas["formula-alignment"]);
 
   // Assert that the vertical align is -4px, which means that is aligner vertically (base) to the previous writen 2222
-  cy.getFormula(0)
-    .should("have.attr", "style")
-    .and("contain", "vertical-align: -4px");
+  cy.getFormula(0).should("have.attr", "style").and("contain", "vertical-align: -4px");
 });

cypress/tests/smoke/STD-004.images.js

@@ -24,8 +24,5 @@ it("formula should have wirisformula class", function () {
   // Get the formula by it's alt text and assert it has the Wirisformula class
   // We could find the formula by using getFormula, but internally, that looks for
   // .Wirisformula, so it defeats the purpose. That's why we use the alt instead.
-  cy.get(`img[alt="${this.formulas["formula-general-alt-es"]}"]`).should(
-    "have.class",
-    "Wirisformula",
-  );
+  cy.get(`img[alt="${this.formulas["formula-general-alt-es"]}"]`).should("have.class", "Wirisformula");
 });

cypress/tests/smoke/STD-019.insertion.js

@@ -29,7 +29,5 @@ it("should be able to edit an existing latex formula", function () {
   });
 
   // Expect that the text editor contains the latex formula
-  cy.getTextEditor()
-    .invoke("text")
-    .should("contain", "$$\\cos^2(x)+\\sin^2(x)=\\log(e)$$");
+  cy.getTextEditor().invoke("text").should("contain", "$$\\cos^2(x)+\\sin^2(x)=\\log(e)$$");
 });

demos/angular/ckeditor5/src/app/app.component.html

@@ -1,7 +1,2 @@
 <!-- [html-validate-disable-next element-name, attr-case] -->
-<ckeditor
-  #myEditor
-  [config]="options"
-  [editor]="Editor"
-  [data]="content"
-></ckeditor>
+<ckeditor #myEditor [config]="options" [editor]="Editor" [data]="content"></ckeditor>

demos/angular/ckeditor5/src/app/app.component.spec.ts

@@ -24,8 +24,6 @@ describe("AppComponent", () => {
     const fixture = TestBed.createComponent(AppComponent);
     fixture.detectChanges();
     const compiled = fixture.nativeElement;
-    expect(compiled.querySelector(".content span").textContent).toContain(
-      "ckeditor5 app is running!",
-    );
+    expect(compiled.querySelector(".content span").textContent).toContain("ckeditor5 app is running!");
   });
 });

demos/angular/ckeditor5/src/app/app.component.ts

@@ -9,8 +9,7 @@ import * as Generic from "resources/demos/imports";
 import packageInfo from "@wiris/mathtype-ckeditor5/package.json";
 
 // Apply specific demo names to all the objects.
-document.getElementById("header_title_name").innerHTML =
-  "MathType for CKEditor 5 on Angular";
+document.getElementById("header_title_name").innerHTML = "MathType for CKEditor 5 on Angular";
 document.getElementById("version_editor").innerHTML = "CKEditor: ";
 
 // Create the initial editor content.
@@ -35,10 +34,7 @@ export class AppComponent implements OnInit {
     // Define the button update
     document.getElementById("btn_update").addEventListener("click", (e) => {
       e.preventDefault();
-      Generic.updateContent(
-        this.myEditor.editorInstance.getData(),
-        "transform_content",
-      );
+      Generic.updateContent(this.myEditor.editorInstance.getData(), "transform_content");
     });
   }