fix: removed HTML tags when copying recipe ingredients (#2533)

mealie-recipes · Aug 31, 2023 · 0a00a6e · 0a00a6e
1 parent 408ca88
commit 0a00a6e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 6 deletions.
diff --git a/frontend/components/Domain/Recipe/RecipeIngredients.vue b/frontend/components/Domain/Recipe/RecipeIngredients.vue
@@ -54,7 +54,7 @@ export default defineComponent({
     const ingredientCopyText = computed(() => {
       return props.value
         .map((ingredient) => {
-          return `${parseIngredientText(ingredient, props.disableAmount, props.scale)}`;
+          return `${parseIngredientText(ingredient, props.disableAmount, props.scale, false)}`;
         })
         .join("\n");
     });

diff --git a/frontend/composables/recipes/use-recipe-ingredients.test.ts b/frontend/composables/recipes/use-recipe-ingredients.test.ts
@@ -31,7 +31,16 @@ describe(parseIngredientText.name, () => {
   test("ingredient text with fraction", () => {
     const ingredient = createRecipeIngredient({ quantity: 1.5, unit: { fraction: true, id: "1", name: "cup" } });
 
-    expect(parseIngredientText(ingredient, false)).contain("1 <sup>1</sup>").and.to.contain("<sub>2</sub>");
+    expect(parseIngredientText(ingredient, false, 1, true)).contain("1 <sup>1</sup>").and.to.contain("<sub>2</sub>");
+  });
+
+  test("ingredient text with fraction no formatting", () => {
+    const ingredient = createRecipeIngredient({ quantity: 1.5, unit: { fraction: true, id: "1", name: "cup" } });
+    const result = parseIngredientText(ingredient, false, 1, false);
+
+    expect(result).not.contain("<");
+    expect(result).not.contain(">");
+    expect(result).contain("1 1/2");
   });
 
   test("sanitizes html", () => {

diff --git a/frontend/composables/recipes/use-recipe-ingredients.ts b/frontend/composables/recipes/use-recipe-ingredients.ts
@@ -10,7 +10,7 @@ function sanitizeIngredientHTML(rawHtml: string) {
   });
 }
 
-export function useParsedIngredientText(ingredient: RecipeIngredient, disableAmount: boolean, scale = 1) {
+export function useParsedIngredientText(ingredient: RecipeIngredient, disableAmount: boolean, scale = 1, includeFormating = true) {
   if (disableAmount) {
     return {
       name: ingredient.note ? sanitizeIngredientHTML(ingredient.note) : undefined,
@@ -35,7 +35,9 @@ export function useParsedIngredientText(ingredient: RecipeIngredient, disableAmo
       }
 
       if (fraction[1] > 0) {
-        returnQty += ` <sup>${fraction[1]}</sup>&frasl;<sub>${fraction[2]}</sub>`;
+        returnQty += includeFormating ?
+          ` <sup>${fraction[1]}</sup>&frasl;<sub>${fraction[2]}</sub>` :
+          ` ${fraction[1]}/${fraction[2]}`;
       }
     } else {
       returnQty = (quantity * scale).toString();
@@ -54,8 +56,8 @@ export function useParsedIngredientText(ingredient: RecipeIngredient, disableAmo
   };
 }
 
-export function parseIngredientText(ingredient: RecipeIngredient, disableAmount: boolean, scale = 1): string {
-  const { quantity, unit, name, note } = useParsedIngredientText(ingredient, disableAmount, scale);
+export function parseIngredientText(ingredient: RecipeIngredient, disableAmount: boolean, scale = 1, includeFormating = true): string {
+  const { quantity, unit, name, note } = useParsedIngredientText(ingredient, disableAmount, scale, includeFormating);
 
   const text = `${quantity || ""} ${unit || ""} ${name || ""} ${note || ""}`.replace(/ {2,}/g, " ").trim();
   return sanitizeIngredientHTML(text);