salesforce / utam-js-recipes Goto Github PK

Actual behavior

Navigating to the 1st record in a standard list view datatable and getting the below error:

• Unable to compile a Page Object
• Invalid generated code
• Runtime error

What is your expected behavior?

It should find the special link within a table and proceed to click on it.

Steps to reproduce

Navigate yourself to any list view and attempt to click on the first record using the below code snippet produced by UTAM chrome extension:

await (await (await (await (await (await utam.load(ConsoleObjectHome)).getListView()).getListViewContainer(ListViewManagerGrid)).getInlineEditGrid()).getTable()).clickHeaderSpecialLink(1);

or

await (await (await (await utam.load(ConsoleObjectHome)).getListView()).getListViewContainer(VirtualDataTable)).clickHeaderSpecialLink(1);

Environment

• Node.js: v16.13.1
• OS: Mac OS
• Browser: Chrome
• Browser Version: 109.0.0

Additional context

UTAM chrome extension finds and highlights the special link correctly.

Keen to join the UTAM support slack channel, my email address is: [email protected]

Hi @olivier-martin-sf @futuremint @mgomes @awaterma @ekashida

To iterate over the related list, I used function getRelatedLists() function that returns the relatedlist elements and inside the for loop I've kept a check that if current element is AuraRelatedList or AppBuilderList.
Check is something like this:

if( (await XYZ.getAuraRelatedList) !== null){
continue;
}

Issues:

1. Even though the iterated related list is of AuraRelatedList, getAuraRelatedList() returning the null instead of returning element thus my check is failing & unable to automate related list functionality. Check my code below:

DOM Snapshot:

2. Below function is throwing an error that waitForAppBuilderListToLoad() is not a function. PATH: salesforce-feature-syntax\node_modules\salesforce-pageobjects\dist\lists\utils\relatedListContainerUtils.js

async getRelatedList(relatedListName) {
        const _result0 = await _getRelatedList({ pageObject: this }, relatedListName)
        return _result0;
    }

The first field in my dynamic forms is a picklist.

1. get RecordActionWrapper
2. get RecordHomeSingleColNoHeaderTemplateDesktop2
3. get Component2 by Id
4. get FieldSection2
5. get Column2 in FieldSection2.
6. get field by column2.getFieldByID(fieldID).
7. get picklist in field to set value.

Actual behavior

Something went wrong here

1. Can not get Column2 from FieldSection2.

let column2List = await fieldSection2.getContent(Column2);
// just 2 Column2 ,but returns 9 elements

2. and also can not get field by Id.

let field = await column2.getFieldByID(fieldID);
// I try to use every item in column2List as column2, no one is right.

3. Can not get element in Field.

let element = await field.getRecordFieldContent(Picklist) ;
// it is empty.

What is your expected behavior?

My project use a dynamic forms in record layout.
I need to create a new record in my e2e test.
I want to set value in field, but I can't get element in field.

PS: I can see element in Chrome developer tool, but no in wdio.
I try to use wdio + selector to get Field, it's also empty .

Steps to reproduce

Environment

• Node.js: v18.12.1

• OS: windows

• Browser: [e.g. chrome]

• Browser Version: [e.g. 119.0.2151.97, Chrome 120.0.6099.71]

    "@wdio/appium-service": "^8.26.1",
    "@wdio/cli": "^8.26.1",
    "@wdio/local-runner": "^8.26.1",
    "@wdio/mocha-framework": "^8.24.12",
    "salesforce-pageobjects": "^5.0.2",
    "wdio-utam-service": "^2.2.0"
  

Additional context

I found a URL, he had the same issuse. So I use his code as demo.
https://salesforce.stackexchange.com/questions/402434/what-am-i-missing-working-with-utam-and-creating-a-record-for-an-object-utilizin

then I print HTML to check, there are no element in records-record-picklist node.

console.log(await informationFieldSection.element.element.getHTML());

<flexipage-field-section2 lwc-mlenr16lk9-host=""><flexipage-column2 slot="columns" class="column flex-width" lwc-67tg8beuu47-host=""><fl
exipage-field data-field-id="RecordCustomerClassification_cField" lwc-6tp3buk1ht8-host=""><record_flexipage-record-field class="slds-grid slds-col slds-has-flexi-truncate" role="listitem" lw
c-618vdk5svck-host=""><records-record-picklist data-input-element-id="input-field" slot="input" lwc-2fnfn23k1jh-host=""></records-record-picklist></record_flexipage-record-field></flexipage-
field><flexipage-field data-field-id="RecordAccountName_cField" lwc-6tp3buk1ht8-host=""><record_flexipage-record-field class="slds-grid slds-col slds-has-flexi-truncate" role="listitem" lwc-
618vdk5svck-host=""><records-record-layout-lookup data-input-element-id="input-field" slot="input" lwc-5tti5094td7-host=""></records-record-layout-lookup></record_flexipage-record-field></fl
exipage-field><flexipage-field data-field-id="RecordAccountManage_cField" lwc-6tp3buk1ht8-host=""><record_flexipage-record-field class="slds-grid slds-col slds-has-flexi-truncate" role="list
item" lwc-618vdk5svck-host=""><records-record-layout-lookup data-input-element-id="input-field" slot="input" lwc-5tti5094td7-host=""></records-record-layout-lookup></record_flexipage-record-
field></flexipage-field></flexipage-column2><flexipage-column2 slot="columns" class="column flex-width" lwc-67tg8beuu47-host=""><flexipage-field data-field-id="RecordTargetReport_cField3" lw
c-6tp3buk1ht8-host=""><record_flexipage-record-field class="slds-grid slds-col slds-has-flexi-truncate" role="listitem" lwc-618vdk5svck-host=""><records-record-layout-checkbox data-input-ele
ment-id="input-field" slot="input" lwc-gjkarqdli1-host=""></records-record-layout-checkbox></record_flexipage-record-field></flexipage-field></flexipage-column2></flexipage-field-section2>

in chrome developer tool, I can see a lot element in records-record-picklist(lightning-picklist, lightning-combox...)

wdio.conf.js contains some outdated path references that trigger warnings when running yarn test:

2021-12-23T11:04:51.069Z WARN @wdio/config:ConfigParser: pattern force-app/**/__wdio__/*.spec.js did not match any file
2021-12-23T11:04:51.079Z WARN @wdio/config:ConfigParser: pattern force-app/test/dreamforce.spec.js did not match any file

According to the official WDIO Jasmine adapter docs, Jasmine options can be passed with a jasmineOpts property:

jasmineOpts: {
    defaultTimeoutInterval: 10000
}

However, the recipes' wdio.conf.js config uses a jasmineNodeOpts property:

jasmineNodeOpts: {
    // max execution time for a script, set to 5 min
    defaultTimeoutInterval: 1000 * 60 * 5,
    // Temporary workaround to get babel to work in wdio tests
    helpers: [path.resolve(process.cwd(), 'wdioJasmineHelper.js')],
}

This means that the timeout and custom helper settings defined in this file are ignored.
We can either remove these options or rename the configuration key to jasmineOpts but the helper doesn't seem to have any effects.

Actual behavior

recordHomeFlexipage2 object not visible when inside a tabset

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

When nested in navexConsoleTabset, a recordHomeFlexipage2 object should be reachable

Steps to reproduce

Record (recordHomeFlexipage2 object) nested in tabSet:

import Flexipage from "salesforce-pageobjects/global/pageObjects/recordHomeFlexipage2";

const flexiPage = await utam.load(Flexipage);
await flexiPage.waitForVisible();
const tabSet = await flexiPage.getTabset();
await (await tabSet.getTabBar()).clickTab("Details");

Returns timeout error even thought the page and record are displayed. So a step to select active content is missing?
Error: waitForVisible method did not complete within timeout 10000ms.

Environment

• Node.js: 14.19.3
• OS: linux
• Browser: chrome
• Browser Version: 105

Additional context

Is your feature request related to a problem? Please describe

When running tests, there's a good change that we either forget to log in or that a session that we obtained earlier has expired.
If this is the case, we are blocked on the login page and the tool performs a series of retries that will lead to an unclear error after timing out.

Describe the solution you'd like

I'm suggesting a solution that I've implemented in the E-Bikes sample app.

Let's save a timestamp when we generate the env file with the login URL:
https://github.com/trailheadapps/ebikes-lwc/blob/main/scripts/generate-login-url.js#L36

In our spec, we then read the timestamp and figure out if if the session has expired:
https://github.com/trailheadapps/ebikes-lwc/blob/main/force-app/test/utam/page-explorer.spec.js#L27

If this is the case, we abort the test with a clear error message.
https://github.com/trailheadapps/ebikes-lwc/blob/main/force-app/test/utam/page-explorer.spec.js#L31

Actual behavior

If you have Node.js 16 installed as your default—or if you use Volta it doesn't matter what your default Node version is—yarn install will fail with the following error:

$ yarn install
yarn install v1.22.5
[1/5] 🔍  Validating package.json...
[2/5] 🔍  Resolving packages...
[3/5] 🚚  Fetching packages...
error [email protected]: The engine "node" is incompatible with this module. Expected version "^10 || ^12 || ^14". Got "16.18.1"
error Found incompatible module.

jasmine 3.6.3 is the required dependency version for @wdio/jasmine-framework ^6.11.0. Since the utam-js-recipes project's package.json specifies a node engine >=14.15.4, and a Volta node version of 16.18.1, this presents a fatal incompatibility for users with any version of Node > 14.

Looks like jasmine 3.6.4 specifically removed the engines field from their package.json, citing more problems than it was worth (including the one reported here). Probably time to update to a version of Jasmine that doesn't break for Node > 14. Looks like @wdio/jasmine-framework 7.0.0 was the first version of jasmine-framework to move to jasmine 3.6.4.

What is your expected behavior?

Any version of Node supported in this repo should support a full project install and build.

Steps to reproduce

• Install Node.js 16.x as your current Node version.
• Run yarn install from the project root.

Environment

• Node.js: 16.18.1
• OS: macOS 12.6.1
• Browser: N/A
• Browser Version: N/A

Additional context

None

Actual behavior

[] Tests are failing
-Errors are in the attached text file.

What is your expected behavior?

I expected the tests to run successfully.

Steps to reproduce

• Follow steps under ReadMe.md section: "Run the local app in a scratch org test"
• Open the scratch org in the browser. (I did not navigate to the UTAM Recipes app)
• Run "yarn test --spec force-app/test/sfdx-scratch-org.spec.js" from terminal.

UTAM_Test_Output.txt

Environment

• Failing test [e.g force-app/test/record-create.spec.js]
• Node.js: v14.15.5
• OS: OSX
• Browser: Chrome
• Browser Version: Version 101.0.4951.64

Additional context

These tests ran successfully after I navigated to the 'UTAM Recipes' app and then re-ran the tests.

Actual behavior

I'm implementing a custom Record Page with LWC's. Once I've navigated to any record, I want to assert if a text is inside one of my custom LWC. When I load my custom component BidDetails, its generated methods don't work properly.

BidDetails is a custom component that goes into the header of a Record Page. I want to expect a string value displayed inside the custom component. The .utam.json file was generated using the UTAM generator and the pageObjects compiled with the /utam-preview config file. However, whenever I tried to load the LWC, I would get a Element is required similar error prompt. To solve this I edited the generated file to have the following instead of the shadow property.

// bidDetails.utam.json
{
  "root": true,
  "selector": {
    "css": "body"
  },
  "elements": [
  ...
}

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

What should I load once I'm on the Record Page? I want to assert the highlighted text

Steps to reproduce

This is how I'm navigating to the Record Page. Visually, after the click I'm inside the desired Record Page

    await (
      await (
        await (
          await (
            await (await utam.load(ObjectHome)).getListView()
          ).getListViewContainer(ListViewManagerGrid)
        ).getInlineEditGrid()
      ).getTable()
    ).clickCellSpecialLink(1);

Environment

• Node.js: v16.14.2
• OS: IOS

Actual behavior

Error loading page object from "salesforce-pageobjects/global/pageObjects/recordHomeFlexipage2" in salesforce-pageobjects 2.0.1

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

import Flexipage from "salesforce-pageobjects/global/pageObjects/recordHomeFlexipage2";
utam.load(FlexiPage2) loads page object and its related methods

Steps to reproduce

npm install [email protected]

import Flexipage from "salesforce-pageobjects/global/pageObjects/recordHomeFlexipage2";
const flexiPage = await utam.load(Flexipage)

Running test containing this statement returns error: Unable to find any valid implementation

Looking at the page object, methods are not implemented:

Environment

• Node.js: v14.19
• OS: Linux
• Browser: chrome
• Browser Version: 105

Actual behavior

UTAM is unable to find LWCs with a CSS attribute filter selector like lightning-input[type='search'].
This issue is specific to LWCs, regular elements can be selected with attribute filters.

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

We should be able to select LWCs with attribute filters like any elements.

Steps to reproduce

Starting from a clean clone of the utam-js-recipes repo, follow these steps:

1. Edit force-app/main/default/lwc/wireGetObjectInfo/__utam__/wireGetObjectInfo.utam.json and change line 17 to

   "css": "lightning-button[label='Get Object Info']"
   

   Notice the attribute filter that we added to search for a specific label.

2. Recompile the page objects: yarn build

3. Run the scratch org tests: yarn test --spec force-app/test/sfdx-scratch-org.spec.js

Notice that the wire test is now failing with this error:

Error: Can't find element with locator 'lightning-button[label='Get Object Info']' inside its scope shadow root within timeout 0ms.

Environment

• Node.js: v14.15.4
• OS: macOs X
• Browser: Chrome
• Browser Version: v98.0.4758.48

Issue

Getting error "Can't find element with locator 'record_flexipage-record-page-decorator."

Using _utam_get_decorator function and I have noticed the element locator is incorrect

async function _utam_get_decorator(driver, root) { let _element = await _utam_get_flexipageModule(driver, root); const _locator = core.By.css("record_flexipage-record-page-decorator"); _element = new core.ShadowRoot(driver, _element); return _element.findElement(_locator); }

What is your expected behavior?

Element locator should be "record_flexipage-desktop-record-page-decorator" in _utam_get_decorator function

DOM Snapshot:

Actual behavior

Hey everyone, we're working with utam-webdriver-jasmine flavors along with TS and during spec run we have noticed the stack trace get truncated if a test failed because of web-element issue [utam waitfor- method or element is not in scope],
in-short we got a complete stack trace in case of assertion failure like which spec line and file, but other failures wont populate complete stack-traces & the error source,

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

during any failure, the complete stack-trace should be visible indicating the spec line which actually caused this issue

Steps to reproduce

1: Create a TS-Jasmine-utam-wdio based project
2: Create few utam files with wait for methods that will fail or some non-existing locators
3: Draft spec file and use utam file and called specific methods or access locators stated in step2
4: Run the spec and observe the stack traces

Environment

• Node.js: v16.18.1
• OS: Windows
• Browser: Chrome
• Browser Version: Latest
• Type script
• • typescript: "^4.8.3",
• Jasmine
• • @wdio/jasmine-framework: "^7.24.1",

Additional context

Refer to attached truncated stack-traces
1:

2:

It would be helpful to set up linting in this project so that we automate things like checking the PO imports.

I can do a PR for this if you're interested. Here's the UTAM specific config that I implemented for the E-Bikes sample app.

Hi @olivier-martin-sf @lizaiv77

I'm facing below issue while retrieving the Record Form
Can't find element with locator 'records-lwc-detail-panel' inside its scope shadow root within timeout 0ms

I have tried lots of other tricks but no luck. Would be great if you can help me resolve this issue ASAP.

below are the attachments of Record form DOM and Record Form modal.

Originally posted by @divymuni in #41 (comment)

Actual behavior

Importing module salesforce-pageobjects/global/pageObjects/recordActionWrapper cause a module not found error on case sensitive file system (Linux)

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

All salesforce-pageobjects modules to follow the same camel case and case sensitivity convention

Steps to reproduce

Run test record-create.spec.js using import RecordActionWrapper from 'salesforce-pageobjects/global/pageObjects/recordActionWrapper'; on case sensitive file system.

Error in Error: cannot find module "node_modules/salesforce-pageobjects/force/pageobjects/changeRecordTypeFooter" because module is in salesforce-pageobjects/force/pageObjects/changeRecordTypeFooter (pageObjects folder instead of pageobjects)

Environment

• Failing test [e.g force-app/test/record-create.spec.js]

• Node.js: 14.19.3
• OS: Amazon Linux 2
• Browser: chrome
• Browser Version: 103

Additional context

HI @olivier-martin-sf

Actual behavior

File path: utam-js-recipes/tree/main/force-app/test/record-update.spec.js

I tried updating a record using above file but execution is failing with the error saying 'Unable to find any valid implementation'.
After debugging the error in detail, I found that 'recordHomeFlexipage2' doesn't have method implementation for getHighlights() method which we're using in test script to access the record highlight panel[Line No: 54 in record-update.spec.js].

FYI, recordHomeFlexipage2 is an interface.
So, my question is,
How did you utilize below line in your test script to edit/update record?
Line no: 11 in record-update.spec.js
import RecordHomeFlexipage2 from 'salesforce-pageobjects/global/pageObjects/recordHomeFlexipage2';

What is your expected behavior?

utam-js-recipes/tree/main/force-app/test/record-update.spec.js file should be executed without any error and
should allow me to edit the record.

Steps to reproduce

• Clone the main repo & do needful steps provided in Readme file
• Execute this command: yarn test --spec force-app/test/record-update.spec.js
• execution will fail and prompts an error

Environment

• Failing test: utam-js-recipes/tree/main/force-app/test/record-update.spec.js
• Node.js: 16.17.0
• OS: Windows
• Browser: Chrome
• Browser Version: 105.0.5195.127

Additional context

Actual behavior

`$ yarn generate:utam
yarn run v1.22.5
$ cd utam-generator && yarn generate && yarn compile
$ utam-generate -c generator.config.json
Generating from C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\utam-generator\src\cards\button.html...[DONE]
Generating from C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\utam-generator\src\cards\icon.html...[DONE]
Generating from C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\utam-generator\src\cards\image.html using rules from image.rules.json...[DONE]
Generating from C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\utam-generator\src\cards\text.html...[DONE]
$ utam -c compiler.config.json
Compiling generated/button.utam.json... C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\node_modules\utam\build\run_utam.js:209
throw new UtamCompilerError(error.toString(entryOptions.entry));
^

UtamCompilerError:
Error in page object generated/button.utam.json {"offset":144,"line":7,"column":24}
error 201: element "button": type "utam-lightning/pageObjects\button" is not supported, valid values are: custom, container, frame, actionable, clickable, draggable, editable, touchable;
tip: custom type must only contain alphanumeric characters with the schema [package-name]/[custom/path]/pageObject

at findAndProcessPOsAndUtils (C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\node_modules\utam\build\run_utam.js:209:27)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async runUtam (C:\Users\manjpura\Desktop\UTAM\utam-js-recipes\node_modules\utam\build\run_utam.js:250:9)

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.`

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

Program should build project with no errors and be able to proceed.

Steps to reproduce

1. Ran yarn install - Worked fine
2. Ran yarn build - This is where it broke

Environment

• Failing test [e.g force-app/test/record-create.spec.js]

• Node.js: [e.g 14.18.2] v16.20.0
• Yarn: 1.22.5
• OS: [e.g. iOS] Windows_NT x64 10.0.19044
• Browser: [e.g. chrome, safari] VSCode

### Actual behavior

[chrome mac os x #0-0] Spec: /Users/sf-unified/utam-js-recipes/force-app/test/record-create.spec.js
[chrome mac os x #0-0] Running: chrome (v) on mac os x
[chrome mac os x #0-0] Session ID: ec32bc66889e3e30dce609b1d166132c
[chrome mac os x #0-0]
[chrome mac os x #0-0] Record creation tests
[chrome mac os x #0-0] ✖ "before all" hook
[chrome mac os x #0-0] ✖ Create a new Account Record
[chrome mac os x #0-0] ✖ Create a new Opportunity Record
[chrome mac os x #0-0]
[chrome mac os x #0-0] 3 failing (1.4s)
[chrome mac os x #0-0]
[chrome mac os x #0-0] 1) Record creation tests "before all" hook
[chrome mac os x #0-0] An element on the interface of UTAM Element or a Locator must be provided in order to load a PageObject
[chrome mac os x #0-0] Error: An element on the interface of UTAM Element or a Locator must be provided in order to load a PageObject
[chrome mac os x #0-0] at UtamLoader.load (/Users//sf-unified/utam-js-recipes/node_modules/@utam/loader/build/index.js:42:19)
[chrome mac os x #0-0] at login (/Users//sf-unified/utam-js-recipes/force-app/test/utilities/salesforce-test.js:23:30)
[chrome mac os x #0-0] at processTicksAndRejections (internal/process/task_queues.js:93:5)
[chrome mac os x #0-0] at UserContext. (/Users//sf-unified/utam-js-recipes/force-app/test/record-create.spec.js:64:9)
[chrome mac os x #0-0] at UserContext.executeAsync (/Users//sf-unified/utam-js-recipes/node_modules/@wdio/utils/build/shim.js:101:16)
[chrome mac os x #0-0] at UserContext.exports.testFrameworkFnWrapper (/Users//sf-unified/utam-js-recipes/node_modules/@wdio/utils/build/test-framework/testFnWrapper.js:25:18)

### Steps to reproduce

Followed the steps as described in the readme file

### Environment

Sanbox

### Additional context

the Login script seems not working and I think the consequent steps are failing.

Actual behavior

Configured the project to point against our test environment.
It logs and loads the Account page
Tests passes until selecting New Account
It fails at the getRecordForm
Can't find element with locator 'records-lwc-detail-panel' inside its scope shadow root within timeout 0ms

What is your expected behavior?

It should return all the items from the recordform and recordlayout calls

Steps to reproduce

1.Cloned utam-js-recipes-main
2.Create .env file for the test environment
3.change the const TEST_ENVIRONMENT_PREFIX = 'sandbox' in the record-create.spec.js and .env file
4.Compile and run the test

Actual behavior

UTAM extension doesn't show any available page object

• Unable to compile a Page Object

• Invalid generated code

• Runtime error

What is your expected behavior?

The extension shows Page Objects from where to select methods

Steps to reproduce

I open the Dev Tools and go to the UTAM tab at the end
Try to find available Page Objects

Environment

• Failing test: It's a private repo

• Node.js: v16.14.2
• OS: IOS
• Browser: Chrome
• Browser Version: latest at the post date

Additional context

We are trying to validate the existence of a field inside a RecordPage inside a custom Lightning App