feat: create preheat scope add percentage and count (#535)

Author: Liam-Zhao

cypress/e2e/job/preheats/create-preheat.cy.ts

@@ -39,6 +39,36 @@ describe('Create preheat', () => {
     cy.viewport(1440, 1080);
   });
 
+  it('can create an All Peers task with a preheat scope of 30%', () => {
+    // By default, there is no percentage and count.
+    cy.get('#count-or-percentage').should('not.exist');
+
+    // Scope select all peers.
+    cy.get('#select-scope').click();
+    cy.get('#all_peers').click();
+
+    cy.get('#all').should('have.text', `Preheat to each peer in the P2P cluster.`);
+
+    cy.get('#count-or-percentage').should('exist');
+
+    cy.get('#radio-percentage').click();
+
+    cy.get('#percentage').click(100, 10);
+
+    // Select count.
+    cy.get('#radio-count').click();
+
+    cy.get('#count').click();
+
+    cy.get('#count').type('50');
+
+    // Scope select all seed peers.
+    cy.get('#select-scope').click();
+    cy.get('#all_seed_peers').click();
+
+    cy.get('#all').should('have.text', `Preheat to each seed peer in the P2P cluster.`);
+  });
+
   it('click the `CANCEL button', () => {
     cy.get('#cancel').click();
 
@@ -427,6 +457,27 @@ describe('Create preheat', () => {
 
       cy.get('#url').type('https://docs');
 
+      // Should display message Piece Length the validation error.
+      cy.get('#select-scope').click();
+      cy.get('#all_peers').click();
+
+      cy.get('#radio-count').click();
+
+      cy.get('#count').should('have.value', '1');
+
+      cy.get('#count').clear();
+
+      cy.get('#count').type('0');
+
+      // Show verification error message.
+      cy.get('#count-helper-text').should('have.text', 'Fill in the characters, the length is 1-200.');
+
+      cy.get('#count').clear();
+
+      cy.get('#count').type('201');
+
+      cy.get('#count-helper-text').should('have.text', 'Fill in the characters, the length is 1-200.');
+
       // Should display message Piece Length the validation error.
       cy.get('#pieceLength').type('0');
 

cypress/e2e/job/preheats/preheat.cy.ts

@@ -98,7 +98,10 @@ describe('Preheat', () => {
       cy.get('[data-testid="preheat-isloading"]').should('not.exist');
 
       // Show preheat scope.
-      cy.get('#scope').should('have.text', 'All Peers');
+      cy.get('#scope').should('contain', 'All Peers');
+
+      // Show preheat scope count.
+      cy.get('#count').should('contain', '100');
 
       // Show preheat status.
       cy.get('#status')
@@ -208,7 +211,10 @@ describe('Preheat', () => {
         .and('not.exist');
 
       // Show preheat scope.
-      cy.get('#scope').should('have.text', 'All Seed Peers');
+      cy.get('#scope').should('contain', 'All Seed Peers');
+
+      // Show preheat scope.
+      cy.get('#percentage').should('contain', '100%');
 
       // Show preheat piece length.
       cy.get('#piece-length').should('have.text', '-');

cypress/fixtures/job/preheats/failure-preheat.json

@@ -11,7 +11,7 @@
     "application": "application-1",
     "concurrent_count": 50,
     "content_for_calculating_task_id": null,
-    "count": null,
+    "count": 100,
     "filtered_query_params": "X-Amz-Algorithm\u0026X-Amz-Credential\u0026X-Amz-Date\u0026X-Amz-Expires\u0026X-Amz-SignedHeaders\u0026X-Amz-Signature\u0026X-Amz-Security-Token\u0026X-Amz-User-Agent\u0026X-Goog-Algorithm\u0026X-Goog-Credential\u0026X-Goog-Date\u0026X-Goog-Expires\u0026X-Goog-SignedHeaders\u0026X-Goog-Signature\u0026OSSAccessKeyId\u0026Expires\u0026Signature\u0026SecurityToken\u0026AccessKeyId\u0026Signature\u0026Expires\u0026X-Obs-Date\u0026X-Obs-Security-Token\u0026q-sign-algorithm\u0026q-ak\u0026q-sign-time\u0026q-key-time\u0026q-header-list\u0026q-url-param-list\u0026q-signature\u0026x-cos-security-token\u0026ns",
     "headers": { "Connection": "keep-alive" },
     "load_to_cache": false,

cypress/fixtures/job/preheats/pending-preheat.json

@@ -16,7 +16,7 @@
     "headers": { "Authorization": "Bearer yJhbGciOiJSUzI1NiIsImtpZCI6IjNEWT" },
     "load_to_cache": false,
     "password": "",
-    "percentage": null,
+    "percentage": 100,
     "piece_length": null,
     "platform": "",
     "scope": "all_seed_peers",

cypress/support/e2e.ts

@@ -14,8 +14,14 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import './commands';
 
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
-import '@cypress/code-coverage/support'
+import '@cypress/code-coverage/support';
+
+Cypress.on('uncaught:exception', (err, runnable) => {
+  // returning false here prevents Cypress from
+  // failing the test
+  return false;
+});

src/assets/images/job/preheat/count.svg

@@ -59,6 +59,19 @@
   background-color: var(--palette-background-paper) !important;
 }
 
+.scope {
+  width: 37rem;
+  margin: 1rem 0;
+  border-radius: 0.25rem !important;
+  background-color: var(--palette-background-paper) !important;
+  border-color: var(--palette-description-color) !important;
+}
+
+.countSelect {
+  width: 12rem;
+  margin: 0.8rem 0 !important;
+}
+
 .contentForCalculatingTaskIDIcon {
   width: 1.25rem;
   height: 1.25rem;