Test(web-twig): Add tests for imageObjectFit property

lmc-eu · Nov 7, 2023 · 5e457ba · 5e457ba
1 parent 7ff223e
commit 5e457ba
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/.../src/Resources/components/FileUploader/__tests__/__fixtures__/fileUploaderAttachment.twig b/.../src/Resources/components/FileUploader/__tests__/__fixtures__/fileUploaderAttachment.twig
@@ -21,4 +21,5 @@
     imagePreview="https://picsum.photos/id/823/162/162"
     onEdit="alert('Edit')"
     removeText="Delete"
+    imageObjectFit="contain"
 />
diff --git a/...ces/components/FileUploader/__tests__/__snapshots__/fileUploaderAttachment.twig.snap.html b/...ces/components/FileUploader/__tests__/__snapshots__/fileUploaderAttachment.twig.snap.html
@@ -15,7 +15,7 @@
     <!-- Render with image preview, for template -->
 
     <li class="FileUploaderAttachment" data-spirit-populate-field="item" data-spirit-imagepreview="true">
-      <span class="FileUploaderAttachment__image"><img src="" width="54" height="54" alt=""></span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
+      <span class="FileUploaderAttachment__image" data-spirit-element="attachment-image"><img src="" width="54" height="54" alt=""></span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
       <path d="M6 22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V4C4 3.45 4.19583 2.97917 4.5875 2.5875C4.97917 2.19583 5.45 2 6 2H13.175C13.4417 2 13.6958 2.05 13.9375 2.15C14.1792 2.25 14.3917 2.39167 14.575 2.575L19.425 7.425C19.6083 7.60833 19.75 7.82083 19.85 8.0625C19.95 8.30417 20 8.55833 20 8.825V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H6ZM12 9V4H6V20H18V10H13C12.7167 10 12.4792 9.90417 12.2875 9.7125C12.0958 9.52083 12 9.28333 12 9Z" fill="currentColor">
       </path></svg> <button type="button" class="FileUploaderAttachment__action" data-spirit-populate-field="button"><span class="accessibility-hidden">Remove</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
       <path d="M18.3 5.70997C17.91 5.31997 17.28 5.31997 16.89 5.70997L12 10.59L7.11 5.69997C6.72 5.30997 6.09 5.30997 5.7 5.69997C5.31 6.08997 5.31 6.71997 5.7 7.10997L10.59 12L5.7 16.89C5.31 17.28 5.31 17.91 5.7 18.3C6.09 18.69 6.72 18.69 7.11 18.3L12 13.41L16.89 18.3C17.28 18.69 17.91 18.69 18.3 18.3C18.69 17.91 18.69 17.28 18.3 16.89L13.41 12L18.3 7.10997C18.68 6.72997 18.68 6.08997 18.3 5.70997Z" fill="currentColor">
@@ -33,7 +33,7 @@
     <!-- Render with file name and image preview -->
 
     <li class="FileUploaderAttachment" data-spirit-populate-field="item">
-      <span class="FileUploaderAttachment__image"><img src="https://picsum.photos/id/823/162/162" width="54" height="54" alt="file.pdf"></span> <span class="FileUploaderAttachment__name"><span class="text-truncate" data-spirit-populate-field="name">file.pdf</span></span> <button type="button" class="FileUploaderAttachment__action" data-spirit-populate-field="button"><span class="accessibility-hidden">Remove</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
+      <span class="FileUploaderAttachment__image" data-spirit-element="attachment-image"><img src="https://picsum.photos/id/823/162/162" width="54" height="54" alt="file.pdf"></span> <span class="FileUploaderAttachment__name"><span class="text-truncate" data-spirit-populate-field="name">file.pdf</span></span> <button type="button" class="FileUploaderAttachment__action" data-spirit-populate-field="button"><span class="accessibility-hidden">Remove</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
       <path d="M18.3 5.70997C17.91 5.31997 17.28 5.31997 16.89 5.70997L12 10.59L7.11 5.69997C6.72 5.30997 6.09 5.30997 5.7 5.69997C5.31 6.08997 5.31 6.71997 5.7 7.10997L10.59 12L5.7 16.89C5.31 17.28 5.31 17.91 5.7 18.3C6.09 18.69 6.72 18.69 7.11 18.3L12 13.41L16.89 18.3C17.28 18.69 17.91 18.69 18.3 18.3C18.69 17.91 18.69 17.28 18.3 16.89L13.41 12L18.3 7.10997C18.68 6.72997 18.68 6.08997 18.3 5.70997Z" fill="currentColor">
       </path></svg></button>
     </li>
@@ -52,7 +52,7 @@
     <!-- Render with all props -->
 
     <li class="FileUploaderAttachment" data-spirit-populate-field="item" data-spirit-imagepreview="true">
-      <span class="FileUploaderAttachment__image"><img src="https://picsum.photos/id/823/162/162" width="54" height="54" alt="file.pdf"></span> <span class="FileUploaderAttachment__name"><span class="text-truncate" data-spirit-populate-field="name">file.pdf</span></span> <span class="FileUploaderAttachment__slot"><button type="button" class="FileUploaderAttachment__action" onclick="alert('Edit')"><span class="accessibility-hidden">Change</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
+      <span class="FileUploaderAttachment__image" data-spirit-element="attachment-image"><img src="https://picsum.photos/id/823/162/162" style="--file-uploader-attachment-image-object-fit: contain" width="54" height="54" alt="file.pdf"></span> <span class="FileUploaderAttachment__name"><span class="text-truncate" data-spirit-populate-field="name">file.pdf</span></span> <span class="FileUploaderAttachment__slot"><button type="button" class="FileUploaderAttachment__action" onclick="alert('Edit')"><span class="accessibility-hidden">Change</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
       <path d="M5 19H6.4L17.5 7.9L16.1 6.5L5 17.6V19ZM19.3 8.925L15.05 4.725L16.45 3.325C16.8333 2.94167 17.3042 2.75 17.8625 2.75C18.4208 2.75 18.8917 2.94167 19.275 3.325L20.675 4.725C21.0583 5.10833 21.2583 5.57083 21.275 6.1125C21.2917 6.65417 21.1083 7.11667 20.725 7.5L19.3 8.925ZM4 21C3.71667 21 3.47917 20.9042 3.2875 20.7125C3.09583 20.5208 3 20.2833 3 20V17.175C3 17.0417 3.025 16.9125 3.075 16.7875C3.125 16.6625 3.2 16.55 3.3 16.45L15.05 4.725L19.3 8.925L7.55 20.7C7.45 20.8 7.3375 20.875 7.2125 20.925C7.0875 20.975 6.95833 21 6.825 21H4ZM16.8 7.2L16.1 6.5L17.5 7.9L16.8 7.2Z" fill="currentColor">
       </path></svg></button></span> <button type="button" class="FileUploaderAttachment__action" data-spirit-populate-field="button"><span class="accessibility-hidden">Delete</span> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewbox="0 0 24 24" fill="none" aria-hidden="true">
       <path d="M18.3 5.70997C17.91 5.31997 17.28 5.31997 16.89 5.70997L12 10.59L7.11 5.69997C6.72 5.30997 6.09 5.30997 5.7 5.69997C5.31 6.08997 5.31 6.71997 5.7 7.10997L10.59 12L5.7 16.89C5.31 17.28 5.31 17.91 5.7 18.3C6.09 18.69 6.72 18.69 7.11 18.3L12 13.41L16.89 18.3C17.28 18.69 17.91 18.69 18.3 18.3C18.69 17.91 18.69 17.28 18.3 16.89L13.41 12L18.3 7.10997C18.68 6.72997 18.68 6.08997 18.3 5.70997Z" fill="currentColor">