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

Add Paste UI Tests for Android #1100

Merged
merged 9 commits into from
Jun 13, 2019
126 changes: 126 additions & 0 deletions __device-tests__/gutenberg-editor-paste.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,126 @@
/**
* @format
* */

/**
* Internal dependencies
*/
import EditorPage from './pages/editor-page';
import {
setupDriver,
isLocalEnvironment,
longPressMiddleOfElement,
tapSelectAllAboveElement,
tapCopyAboveElement,
tapPasteAboveElement,
stopDriver,
isAndroid,
} from './helpers/utils';
import testData from './helpers/test-data';

jasmine.DEFAULT_TIMEOUT_INTERVAL = 240000;

describe( 'Gutenberg Editor paste tests', () => {
// skip iOS for now
if ( ! isAndroid() ) {
it( 'skips the tests on any platform other than Android', async () => {
} );
return;
}

let driver;
let editorPage;
let allPassed = true;

// Use reporter for setting status for saucelabs Job
if ( ! isLocalEnvironment() ) {
const reporter = {
specDone: async ( result ) => {
allPassed = allPassed && result.status !== 'failed';
},
};

jasmine.getEnv().addReporter( reporter );
}

beforeAll( async () => {
driver = await setupDriver();
await driver.setClipboard( '', 'plaintext' );
editorPage = new EditorPage( driver );
} );

it( 'copies plain text from one paragraph block and pastes in another', async () => {
await editorPage.addNewParagraphBlock();
const paragraphBlockElement = await editorPage.getParagraphBlockAtPosition( 1 );

if ( isAndroid() ) {
await paragraphBlockElement.click();
}

await editorPage.sendTextToParagraphBlock( paragraphBlockElement, testData.pastePlainText );
const textViewElement = await editorPage.getTextViewForParagraphBlock( paragraphBlockElement );

// copy content to clipboard
await longPressMiddleOfElement( driver, textViewElement );
await tapSelectAllAboveElement( driver, textViewElement );
await tapCopyAboveElement( driver, textViewElement );

// create another paragraph block
await editorPage.addNewParagraphBlock();
const paragraphBlockElement2 = await editorPage.getParagraphBlockAtPosition( 2 );

if ( isAndroid() ) {
await paragraphBlockElement2.click();
}

const textViewElement2 = await editorPage.getTextViewForParagraphBlock( paragraphBlockElement2 );

// paste into second paragraph block
await longPressMiddleOfElement( driver, textViewElement2 );
await tapPasteAboveElement( driver, textViewElement2 );

const text = await editorPage.getTextForParagraphBlockAtPosition( 2 );
expect( text ).toBe( testData.pastePlainText );
} );

it( 'copies styled text from one paragraph block and pastes in another', async () => {
// create paragraph block with styled text by editing html
await editorPage.setHtmlContentAndroid( testData.pasteHtmlText );
const paragraphBlockElement = await editorPage.getParagraphBlockAtPosition( 1 );

if ( isAndroid() ) {
await paragraphBlockElement.click();
}

const textViewElement = await editorPage.getTextViewForParagraphBlock( paragraphBlockElement );

// copy content to clipboard
await longPressMiddleOfElement( driver, textViewElement );
await tapSelectAllAboveElement( driver, textViewElement );
await tapCopyAboveElement( driver, textViewElement );

// create another paragraph block
await editorPage.addNewParagraphBlock();
const paragraphBlockElement2 = await editorPage.getParagraphBlockAtPosition( 2 );

if ( isAndroid() ) {
await paragraphBlockElement2.click();
}

const textViewElement2 = await editorPage.getTextViewForParagraphBlock( paragraphBlockElement2 );

// paste into second paragraph block
await longPressMiddleOfElement( driver, textViewElement2 );
await tapPasteAboveElement( driver, textViewElement2 );

// check styled text by verifying html contents
await editorPage.verifyHtmlContent( testData.pasteHtmlTextResult );
} );

afterAll( async () => {
if ( ! isLocalEnvironment() ) {
driver.sauceJobStatus( allPassed );
}
await stopDriver( driver );
} );
} );
10 changes: 10 additions & 0 deletions __device-tests__/helpers/test-data.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,3 +17,13 @@ exports.listEndedHtml = `<!-- wp:list -->
<!-- wp:paragraph -->
<p></p>
<!-- /wp:paragraph -->`;

exports.pastePlainText = `Hello paste`;

const pastedHtmlText = `<!-- wp:paragraph -->
<p><strong>Hello</strong> paste</p>
<!-- /wp:paragraph -->`;

exports.pasteHtmlText = pastedHtmlText;

exports.pasteHtmlTextResult = `${ pastedHtmlText }\n\n${ pastedHtmlText }`;
52 changes: 52 additions & 0 deletions __device-tests__/helpers/utils.js
Original file line number Diff line number Diff line change
Expand Up @@ -183,6 +183,54 @@ const clickBeginningOfElement = async ( driver: wd.PromiseChainWebdriver, elemen
await action.perform();
};

// long press to activate context menu
const longPressMiddleOfElement = async ( driver: wd.PromiseChainWebdriver, element: wd.PromiseChainWebdriver.Element ) => {
const location = await element.getLocation();
const size = await element.getSize();

const action = await new wd.TouchAction( driver );
const x = location.x + ( size.width / 2 );
const y = location.y + ( size.height / 2 );
action.press( { x, y } );
action.wait( 2000 );
action.release();
await action.perform();
};

// press "Select All" in floating context menu
const tapSelectAllAboveElement = async ( driver: wd.PromiseChainWebdriver, element: wd.PromiseChainWebdriver.Element ) => {
const location = await element.getLocation();
const action = await new wd.TouchAction( driver );
const x = location.x + 300;
const y = location.y - 50;
action.press( { x, y } );
//action.wait( 1000 );
action.release();
await action.perform();
};

// press "Copy" in floating context menu
const tapCopyAboveElement = async ( driver: wd.PromiseChainWebdriver, element: wd.PromiseChainWebdriver.Element ) => {
const location = await element.getLocation();
const action = await new wd.TouchAction( driver );
const x = location.x + 220;
const y = location.y - 50;
action.press( { x, y } );
//action.wait( 1000 );
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We can probably remove this right?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I'll push a commit to remove those. Initially, I wasn't sure if they were required, as I'd seen similar waits on examples online.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, I've removed them.

action.release();
await action.perform();
};

// press "Paste" in floating context menu
const tapPasteAboveElement = async ( driver: wd.PromiseChainWebdriver, element: wd.PromiseChainWebdriver.Element ) => {
const location = await element.getLocation();
const action = await new wd.TouchAction( driver );
action.press( { x: location.x + 100, y: location.y - 50 } );
//action.wait( 1000 );
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And this one

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I will remove this.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ok, I've removed them.

action.release();
await action.perform();
};

// Starts from the middle of the screen or the element(if specified)
// and swipes upwards
const swipeUp = async ( driver: wd.PromiseChainWebdriver, element: wd.PromiseChainWebdriver.Element = undefined ) => {
Expand Down Expand Up @@ -241,6 +289,10 @@ module.exports = {
typeString,
clickMiddleOfElement,
clickBeginningOfElement,
longPressMiddleOfElement,
tapSelectAllAboveElement,
tapCopyAboveElement,
tapPasteAboveElement,
swipeUp,
stopDriver,
toggleHtmlMode,
Expand Down
10 changes: 10 additions & 0 deletions __device-tests__/pages/editor-page.js
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,16 @@ export default class EditorPage {
await toggleHtmlMode( this.driver, false );
}

// set html editor content explicitly
async setHtmlContentAndroid( html: string ) {
await toggleHtmlMode( this.driver, true );

const htmlContentView = await this.getTextViewForHtmlViewContent();
await htmlContentView.setText( html );

await toggleHtmlMode( this.driver, false );
}

// =========================
// Block toolbar functions
// =========================
Expand Down