Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Sync page refactor. #2738

Merged
merged 27 commits into from
May 12, 2022
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
27 commits
Select commit Hold shift + click to select a range
55f86e4
WIP Sync page JS rewrite.
JakePT May 3, 2022
3d5a8c7
Mild refactor of sync page JS to improve clarity.
JakePT May 9, 2022
777f1e3
Remove unused class.
JakePT May 10, 2022
55a670e
Handle request errors.
JakePT May 10, 2022
a2e34c2
Fix totals counting.
JakePT May 10, 2022
f3db232
Move sync page markup to its own component.
JakePT May 10, 2022
d9e9c2c
Fix type capitalisation.
JakePT May 10, 2022
87daa80
Fix typo.
JakePT May 10, 2022
f9a0eb5
Open learn more in new tab.
JakePT May 10, 2022
60481b9
Name catch callback consistently.
JakePT May 10, 2022
f505994
Remove old sync script.
JakePT May 10, 2022
c5f9895
Add warning icon.
JakePT May 10, 2022
1b80f6c
Merge branch 'develop' into feature/2704
JakePT May 10, 2022
ba45e72
Fix linting errors.
JakePT May 10, 2022
08d3ca0
Merge branch 'feature/2704' of github.com:10up/ElasticPress into feat…
JakePT May 10, 2022
423fbce
Update Cypress tests.
JakePT May 10, 2022
37a9626
Fix complete message in test.
JakePT May 10, 2022
8d45859
Remove background from time in sync progress.
JakePT May 10, 2022
1be165e
Fix test expected text.
JakePT May 10, 2022
566cf75
Update other feature tests.
JakePT May 10, 2022
5d2a682
Fix index status endpoint.
JakePT May 10, 2022
e8d3318
Allow stopping WP CLI syncing.
JakePT May 10, 2022
ac19eb2
Tweak progress bar size.
JakePT May 10, 2022
c05e484
Tweak sync logo.
JakePT May 10, 2022
2a669c1
Restore missing plugin header.
JakePT May 10, 2022
8682539
Fix missing synced count.
JakePT May 11, 2022
2beaafe
Normalize ellipsis usage
felipeelia May 12, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
Update Cypress tests.
  • Loading branch information
JakePT committed May 10, 2022
commit 423fbce88ad48b298328aba8d8255aaa6e0d17f4
5 changes: 3 additions & 2 deletions assets/css/sync/button.css
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
.ep-sync-button {
height: 4rem;
width: 100%;

&.components-button.has-icon.has-text {
height: 4rem;
justify-content: center;
width: 100%;

& svg {
height: 2em;
Expand All @@ -18,6 +18,7 @@
font-weight: 700;
}

.ep-sync-button--pause,
.ep-sync-button--resume,
.ep-sync-button--stop {
flex-direction: column;
Expand Down
1 change: 1 addition & 0 deletions assets/js/sync/components/sync-page.js
Original file line number Diff line number Diff line change
Expand Up @@ -127,6 +127,7 @@ export default ({

<p>
<Button
className="ep-sync-button ep-sync-button--delete"
disabled={isSyncing}
isSecondary
isDestructive
Expand Down
32 changes: 22 additions & 10 deletions assets/js/sync/components/sync/controls.js
Original file line number Diff line number Diff line change
Expand Up @@ -49,16 +49,28 @@ export default ({ disabled, isPaused, isSyncing, onPause, onResume, onStop, onSy

{isSyncing ? (
<>
<div className="ep-sync-controls__resume">
<Button
className="ep-sync-button ep-sync-button--resume"
disabled={disabled}
icon={isPaused ? play : pause}
isPrimary
onClick={isPaused ? onResume : onPause}
>
{isPaused ? __('Resume', 'elasticpress') : __('Pause', 'elasticpress')}
</Button>
<div className="ep-sync-controls__pause-resume">
{isPaused ? (
<Button
className="ep-sync-button ep-sync-button--resume"
disabled={disabled}
icon={play}
isPrimary
onClick={onResume}
>
{__('Resume', 'elasticpress')}
</Button>
) : (
<Button
className="ep-sync-button ep-sync-button--pause"
disabled={disabled}
icon={pause}
isPrimary
onClick={onPause}
>
{__('Pause', 'elasticpress')}
</Button>
)}
</div>

<div className="ep-sync-controls__stop">
Expand Down
34 changes: 15 additions & 19 deletions tests/cypress/integration/dashboard-sync.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@ describe('Dashboard Sync', () => {
}

function resumeAndWait() {
cy.get('.ep-delete-data-and-sync .resume-sync').click();
cy.get('.ep-delete-data-and-sync .ep-sync-box__progress-info', {
cy.get('.ep-sync-button--resume').click();
cy.get('.ep-sync-progress', {
timeout: Cypress.config('elasticPressIndexTimeout'),
}).should('contain.text', 'Sync completed');
}
Expand All @@ -37,8 +37,8 @@ describe('Dashboard Sync', () => {

it('Can index content and see indexes names in the Health Screen', () => {
cy.visitAdminPage('admin.php?page=elasticpress-sync');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-delete-data-and-sync .ep-sync-box__progress-info', {
cy.get('.ep-sync-button--delete').click();
cy.get('.ep-sync-progress', {
timeout: Cypress.config('elasticPressIndexTimeout'),
}).should('contain.text', 'Sync completed');

Expand All @@ -55,8 +55,8 @@ describe('Dashboard Sync', () => {
);

cy.visitAdminPage('admin.php?page=elasticpress-sync');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-delete-data-and-sync .ep-sync-box__progress-info', {
cy.get('.ep-sync-button--delete').click();
cy.get('.ep-sync-progress', {
timeout: Cypress.config('elasticPressIndexTimeout'),
}).should('contain.text', 'Sync completed');

Expand Down Expand Up @@ -85,8 +85,8 @@ describe('Dashboard Sync', () => {
);

cy.visitAdminPage('network/admin.php?page=elasticpress-sync');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-delete-data-and-sync .ep-sync-box__progress-info', {
cy.get('.ep-sync-button--delete').click();
cy.get('.ep-sync-progress', {
timeout: Cypress.config('elasticPressIndexTimeout'),
}).should('contain.text', 'Sync completed');

Expand Down Expand Up @@ -120,17 +120,14 @@ describe('Dashboard Sync', () => {
cy.visitAdminPage('admin.php?page=elasticpress-sync');

cy.intercept('POST', '/wp-admin/admin-ajax.php*').as('ajaxRequest');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-sync-button--delete').click();
cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);
cy.get('.ep-delete-data-and-sync .pause-sync').should('be.visible');
cy.get('.ep-sync-button--pause').should('be.visible');

cy.visitAdminPage('index.php');

cy.visitAdminPage('admin.php?page=elasticpress-sync');
cy.get('.ep-delete-data-and-sync .ep-sync-box__progress-info').should(
'contain.text',
'Sync in progress',
);
cy.get('.ep-sync-progress').should('contain.text', 'Sync in progress');

resumeAndWait();

Expand All @@ -144,7 +141,7 @@ describe('Dashboard Sync', () => {

cy.visitAdminPage('admin.php?page=elasticpress-sync');
cy.intercept('POST', '/wp-admin/admin-ajax.php*').as('ajaxRequest');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-sync-button--delete').click();
cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);

cy.visitAdminPage('admin.php?page=elasticpress');
Expand All @@ -164,12 +161,11 @@ describe('Dashboard Sync', () => {

cy.visitAdminPage('admin.php?page=elasticpress-sync');
cy.intercept('POST', '/wp-admin/admin-ajax.php*').as('ajaxRequest');
cy.get('.ep-delete-data-and-sync__button-delete').click();
cy.get('.ep-sync-button--delete').click();
cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);

cy.get('.ep-delete-data-and-sync .pause-sync').should('be.visible');
cy.get('.ep-delete-data-and-sync .pause-sync').click();
cy.wait('@ajaxRequest').its('response.statusCode').should('eq', 200);
cy.get('.ep-sync-button--pause').should('be.visible');
cy.get('.ep-sync-button--pause').click();

cy.wpCli('wp elasticpress index', true)
.its('stderr')
Expand Down