Merge branch 'master' of github.com:wcreateweb/wordpress-plugin into task/logging-troubleshooting

Author: tijmenbruggeman

src/js/bulk-optimization.js

@@ -201,20 +201,19 @@
   }
 
   function drawSomeRows(items, rowsToDraw) {
-    var list = jQuery('#optimization-items tbody');
-    var row;
-    for (var drawNow = window.totalRowsDrawn; drawNow < Math.min( rowsToDraw + window.totalRowsDrawn, items.length); drawNow++) {
-      row = jQuery('<tr class=\'media-item\'>' +
-          '<th class=\'thumbnail\' />' +
-          '<td class=\'column-primary name\' />' +
-          '<td class=\'column-author initial-size\' data-colname=\'' + tinyCompress.L10nInitialSize + '\' ></>' +
-          '<td class=\'column-author optimized-size\' data-colname=\'' + tinyCompress.L10nCurrentSize + '\' ></>' +
-          '<td class=\'column-author savings\' data-colname=\'' + tinyCompress.L10nSavings + '\' ></>' +
-          '<td class=\'column-author status todo\' data-colname=\'' + tinyCompress.L10nStatus + '\' />' +
-        '</tr>');
-      row.find('.status').html(tinyCompress.L10nWaiting).attr('data-status', 'waiting');
-      row.find('.name').html(items[drawNow].post_title);
-      list.append(row);
+    const list = jQuery('#optimization-items tbody');
+    let drawNow = window.totalRowsDrawn;
+    for(let i = drawNow;i < Math.min(rowsToDraw + window.totalRowsDrawn, items.length); i++) {
+      const tableRow = `<tr class="media-item">
+        <td class="thumbnail" />
+        <td class="column-primary name">${items[i].post_title}</th>
+        <td class="column-author initial-size" data-colname="${tinyCompress.L10nInitialSize}" />
+        <td class="column-author optimized-size" data-colname="${tinyCompress.L10nCurrentSize}" />
+        <td class="column-author savings" data-colname="${tinyCompress.L10nSavings}" />
+        <td class="column-author status" data-testid="bulk-item-status-${i}" data-colname="${tinyCompress.L10nStatus}" data-status="waiting">${tinyCompress.L10nWaiting}</td>
+      </tr>`;
+      list.append(tableRow);
+      drawNow = i;
     }
     window.totalRowsDrawn = drawNow;
   }

src/views/bulk-optimization.php

@@ -264,8 +264,8 @@
 				<th class="column-primary" ><?php esc_html_e( 'File', 'tiny-compress-images' ) ?></th>
 				<th class="column-author"><?php esc_html_e( 'Initial Size', 'tiny-compress-images' ) ?></th>
 				<th class="column-author"><?php esc_html_e( 'Current Size', 'tiny-compress-images' ) ?></th>
-				<th class="column-author savings" ><?php esc_html_e( 'Savings', 'tiny-compress-images' ) ?></th>
-				<th class="column-author status" ><?php esc_html_e( 'Status', 'tiny-compress-images' ) ?></th>
+				<th class="column-author savings"><?php esc_html_e( 'Savings', 'tiny-compress-images' ) ?></th>
+				<th class="column-author status"><?php esc_html_e( 'Status', 'tiny-compress-images' ) ?></th>
 			</tr>
 		</thead>
 		<tbody>

test/integration/bulkoptimization.spec.ts

@@ -182,7 +182,7 @@ test.describe('bulkoptimization', () => {
   });
 
   test('will only apply a conversion when images are already compressed but not converted', async ({ page }) => {
-    // only optimize original size
+    await setAPIKey(page, 'JPG123');
     await enableCompressionSizes(page, ['0']);
 
     // upload 1 image and automaticly compress it, but not convert it yet
@@ -197,8 +197,12 @@ test.describe('bulkoptimization', () => {
 
     // apply bulk optimization
     await page.goto('/wp-admin/upload.php?page=tiny-bulk-optimization');
-    await page.locator('#id-start').click();
-    await page.waitForLoadState('networkidle');
+    await Promise.all([
+      page.waitForResponse(res => 
+        res.url().includes('admin-ajax.php') && res.status() === 200
+      ),
+      page.locator('#id-start').click(),
+    ]);
 
     // we are expecting 2 unoptimized images sizes = 2 conversion and 1 compression
     // expect two rows in the optimization items table
@@ -207,8 +211,8 @@ test.describe('bulkoptimization', () => {
 
     // first row should have "1 compressed and 1 converted"
     // second row should have "1 converted"
-    await expect(optimizationRows.first()).toContainText('1 compressed 1 converted');
-    await expect(optimizationRows.nth(1)).toContainText('1 converted');
+    await expect(page.getByTestId(`bulk-item-status-1`)).toContainText('1 compressed 1 converted');
+    await expect(page.getByTestId(`bulk-item-status-0`)).toContainText('1 converted');
 
     // this should have cost us 3 credits
   });