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

Missing TS types for scrollTo alignment options and .api page for it is ambiguous #2701

Closed
bvobart opened this issue Apr 13, 2023 · 0 comments · Fixed by #2703
Closed

Missing TS types for scrollTo alignment options and .api page for it is ambiguous #2701

bvobart opened this issue Apr 13, 2023 · 0 comments · Fixed by #2703

Comments

@bvobart
Copy link
Contributor

bvobart commented Apr 13, 2023

Describe the bug
The TypeScript types for scrollTo are incomplete, they are missing the vertical alignment and horizontal alignment arguments. Additionally, Taiko's .api page for scrollTo is ambiguous regarding the exact options to be used. The parameters list shows:

  * options.blockAlignment - string - Defines vertical alignment. (optional, default 'nearest')
  * options.inlineAligment - string - Defines horizontal alignment. (optional, default 'nearest')

while the example below it shows:

await scrollTo('Get Started',{ alignments: { block: 'center', inline: 'center' }})

There is also no mention of which values are allowed to be used for these alignment options (note also the apparent typo in inlineAligment).

To Reproduce
Steps (or script) to reproduce the behavior:

const { storage, openBrowser, goto, scrollTo, closeBrowser } = require('taiko');
(async () => {
    try {
        await openBrowser();
        await goto('https://github.com/getgauge/taiko');

        // per default, scrolls to 'nearest', i.e. the text will be at the bottom of the screen
        await scrollTo("Taiko is a free and open source browser automation tool built by the team behind Gauge from ThoughtWorks.");

        // manually scroll up to top of page

        // using this option as specified in the parameters, correctly scrolls to the text such that it is vertically centred on screen.
        await scrollTo("Taiko is a free and open source browser automation tool built by the team behind Gauge from ThoughtWorks.", { blockAlignment: 'center' });

        // manually scroll up to top of page

        // using this option as specified in the examples, seems to ignore the option and just perform the same thing as specifying no options or an empty options object.
        await scrollTo("Taiko is a free and open source browser automation tool built by the team behind Gauge from ThoughtWorks.", { alignments: { block: 'center' } });

    } catch (error) {
        console.error(error);
    } finally {
        await closeBrowser();
    }
})();

Logs

> .api scrollTo
Scrolls the page to the given element.
The alignment parameters can be overridden, see below.
Tthe possible values reference are available at the https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView .

Parameters:

* selector - selector|string - A selector of an element to scroll to. 
* options - Object -  (optional, default {})
  * options.waitForNavigation - boolean - Wait for navigation after the goto. Default navigationTimeout is 30 seconds to override pass { navigationTimeout: 10000 } in options parameter. (optional, default true)
  * options.waitForEvents - Array<string> - Events available to wait for ['DOMContentLoaded', 'loadEventFired', 'networkAlmostIdle', 'networkIdle', 'firstPaint', 'firstContentfulPaint', 'firstMeaningfulPaint', 'targetNavigated'] (optional, default [])
  * options.navigationTimeout - number - Navigation timeout value in milliseconds for navigation after click. (optional, default 30000)
  * options.waitForStart - number - time to wait for navigation to start. Accepts value in milliseconds. (optional, default 100)
  * options.blockAlignment - string - Defines vertical alignment. (optional, default 'nearest')
  * options.inlineAligment - string - Defines horizontal alignment. (optional, default 'nearest')


Returns: Promise<void> 

Examples:
        await scrollTo('Get Started')
        await scrollTo(link('Get Started'))
        await scrollTo('Get Started',{ alignments: { block: 'center', inline: 'center' }})

Expected behavior
Non-ambiguous .api page for scrollTo's alignment options and inclusion of the alignment options in Taiko's TypeScript types

Versions:

  • Taiko: Version: 1.3.9 (Chromium: 110.0.5478.0) RELEASE
  • OS: Manjaro Linux
  • Node.js: v16.18.1
> gauge -v
Gauge version: 1.4.3
Commit Hash: f98dd40

Plugins
-------
html-report (4.2.0)
screenshot (0.1.0)
ts (0.1.0)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging a pull request may close this issue.

1 participant