text-rx-page-objects v1.33.1
#Index
Modules
- encore.rxCharacterCount
- encore.rxOptionFormTable
- encore.rxSortableColumn
- encore.rxStatusColumn
- encore.exercise.rxCharacterCount
- encore.exercise.rxPaginate
Namespaces
- rxCharacterCount
- rxForm
- rxOptionFormTable
- rxOptionFormTable.emptyMessage
- rxOptionFormTable.selectedRow
- rxOptionFormTable.columnNames
- rxOptionFormTable.selections
- rxOptionFormTable.disabledOptions
- rxOptionFormTable.isEmpty()
- rxOptionFormTable.columnData(columnName, [customFn])
- rxOptionFormTable.unselectAll()
- rxOptionFormTable.unselectByColumnText(columnName, columnText)
- rxOptionFormTable.unselectMany(selections)
- rxOptionFormTable.selectByColumnText(columnName, columnText)
- rxOptionFormTable.selectMany(selections)
- rxOptionFormTable.row
- rxSortableColumn
- rxSortableColumns
#encore.rxCharacterCount Members
##encore.rxCharacterCount.main
Returns: rxCharacterCount - Page object representing the first rxCharacterCount object found on the page.
##encore.rxCharacterCount.initialize(rxCharacterCountElement)
Params
- rxCharacterCountElement
WebElement
- WebElement to be transformed into an rxCharacterCountElement object
Returns: rxCharacterCount - Page object representing the rxCharacterCount object.
#encore.rxOptionFormTable
Members
##encore.rxOptionFormTable.main
Returns: rxOptionFormTable - Page object representing the first rxOptionFormTable object found on the page.
##encore.rxOptionFormTable.initialize(rxOptionFormTableElement)
Params
- rxOptionFormTableElement
WebElement
- Web element to become an rxOptionFormTable object.
Returns: rxOptionFormTable - Page object representing the rxOptionFormTable object.
#encore.rxSortableColumn
Members
##encore.rxSortableColumn.initialize(rxSortableColumnElement, repeaterString) Params
- rxSortableColumnElement
WebElement
- WebElement to be transformed into an rxSortableColumn object. - [repeaterString]
String
- Repeater string from the table. Required for data
Returns: Page
- Page object representing the rxSortableColumn object.
##encore.rxSortableColumn.byTable(tableElement)
Params
- tableElement
WebElement
- Web element of the entire<table>
node.
Returns: Page
- rxSortableColumns Page object representing the rxSortableColumns object.
##const: encore.rxSortableColumn.sortDirections
Returns: Object
- sortDirections Lookup of integer codes for sort directions from human-readable ones.
Example
var sorts = encore.rxSortableColumn.sorts;
// ...
it('should sort the column ascending by default', function () {
expect(column.currentSortDirection).to.eventually.equal(sorts.ascending);
});
#encore.rxStatusColumn Members
##encore.rxStatusColumn.initialize(rxStatusCellElement) Params
- rxStatusCellElement
WebElement
- Status cell element from a table row.
Returns: Page
- Page object representing an rxStatusColumn.
##const: encore.rxStatusColumn.statuses
Returns: Object
- Lookup of status strings from human-readable statuses.
##const: encore.rxStatusColumn.icons
Returns: Object
- Lookup of icon class names from a human-readable version.
##const: encore.rxStatusColumn.colors
Returns: Object
- Lookup of color class names from a human-readable class name.
#encore.exercise.rxCharacterCount
rxCharacterCount exercises.
Params
- [options=]
Object
- Test options. Used to build valid tests.- [cssSelector=]
string
- Fallback selector string to initialize widget with. - [maxCharacters=254]
Number
- The total number of characters allowed. - [nearLimit=10]
Number
- The number of remaining characters needed to trigger the "near-limit" class. - [ignoreInsignificantWhitespace=false]
Boolean
- Whether or not the textbox ignores leading and trailing whitespace when calculating the remaining character count.
- [cssSelector=]
Example
describe('default exercises', encore.exercise.rxCharacterCount({
cssSelector: '.demo-custom-max-characters', // select one of many widgets on page
maxCharacters: 25,
nearLimit: 12,
ignoreInsignificantWhitespace: false
}));
#encore.exercise.rxPaginate rxPaginate exercises.
Params
- [options=]
Object
- Test options. Used to build valid tests.- [cssSelector=]
string
- Fallback selector string to initialize pagination widget with. - [pages=6]
string
- Estimated page size in the pagination widget. - pageSizes=50,
Array.<number>
- 200, 350, 500] - Page sizes to validate. - [defaultPageSize=50]
number
- Default page size on page load. - [invalidPageSize=45]
number
- For testing resizing pagination to invalid items per page.
- [cssSelector=]
Example
describe('default exercises', encore.exercise.rxPaginate({
cssSelector: '.secondary-info rx-paginate', // select one of many pagination tables
pages: 20 // will exercise full functionality at 6, limited functionality at 2
}));
#rxCharacterCount Members
##rxCharacterCount.comment Get and set the comment's textual content. Will erase the current text when setting new text.
Params
- text
String
- The desired comment to be sent via.sendKeys(text)
.
Returns: String
- The current comment's text, via .getAttribute('value')
.
Example
it('should erase all text and replace it with new text on update', function () {
rxCharacterCount.comment = 'Bar';
expect(rxCharacterCount.comment).to.eventually.equal('Bar');
});
##rxCharacterCount.remaining
Returns: Number
- The remaining number of characters that can be entered.
##rxCharacterCount.overLimitText
Returns: String
- The characters that are over the limit.
##rxCharacterCount.isDisplayed()
Returns: Boolean
- Whether the root element is currently displayed.
##rxCharacterCount.isNearLimit()
Returns: Boolean
- Whether or not the 'near-limit' class is displayed.
##rxCharacterCount.isOverLimit()
Returns: Boolean
- Whether or not the 'over-limit' class is displayed.
#rxForm
Members
- rxForm
##rxForm.currencyToPennies(currencyString)
Transform currencyString
(USD) to an integer representing pennies. Built to reverse Angular's 'currency' filter.
If your currency string includes fractions of a penny, that precision will be lost!
Params
- currencyString
string
- Raw text as output by Angular'scurrency
filter.
Example
encore.rxForm.currencyToPennies('$0.01') == 1
encore.rxForm.currencyToPennies('$0.019') == 1
encore.rxForm.currencyToPennies('$100 CAN') == 10000
encore.rxForm.currencyToPennies('($100 AUS)') == -10000
encore.rxForm.currencyToPennies('($1.011)') == -101
encore.rxForm.currencyToPennies('$1.10') == 110
##rxForm.slowClick(elem)
Equivalent to browser.actions().mouseDown(elem).mouseUp().perform();
.
This function should be used when dealing with odd or unusual behavior while interacting with click events
that don't seem to work right. Either the element does not appear to respond to a normal .click()
call, or
the element is responding to more than one click event. This typically happens more often in Firefox than
in other browsers. See select for an example of a function that will
slow click an element to achieve consistent behavior.
Params
- elem
WebElement
- Web element to "slow click".
Returns: undefined
##rxForm.dropdown
Members
###dropdown.options
Returns: Array.<string>
- The text of each option element in the dropdown.
###dropdown.values
Returns: Array.<string>
- The value of each option element in the dropdown.
###dropdown.selectedOption
Returns: option - Page object representing the currently selected option.
###dropdown.optionCount()
Returns: number
- The number of options in the dropdown.
###dropdown.optionExists(optionText)
Params
- optionText
string
- The text to check for existence in the dropdown.
Returns: boolean
- Whether or not the option exists.
###dropdown.select(optionText)
Params
- optionText
string
- Partial or total string matching the desired option to select.
Returns: undefined
Example
var dropdown = encore.rxForm.dropdown.initialize($('#country-select'));
dropdown.select('United States');
###dropdown.initialize(selectElement) Params
- selectElement
WebElement
- Should be a<select>
tag.
Returns: dropdown - Page object representing a dropdown.
###dropdown.option
Params
- optionText
string
- Partial or total string matching the desired option to select.
Returns: option - Page object representing an option.
Members
####option.text
Returns: string
- The text inside of the current option.
####option.value
Returns: string
- The "value" attribute from the option html tag.
####option.select()
Selects the option from the dropdown.
Returns: undefined
####option.isSelected()
Returns: Boolean
- Whether or no the option is currently the selected option.
##rxForm.checkbox
Members
###checkbox.initialize(checkboxElement) Params
- checkboxElement
WebElement
- Should be an<input>
tag.
Returns: checkbox - Page object representing a checkbox.
###checkbox.isSelected()
Abstraction over checkboxObject.rootElement.isSelected()
to keep things shorter.
Returns: boolean
- Whether or not the checkbox is currently selected.
###checkbox.select()
Selects the current checkbox.
Returns: undefined
###checkbox.unselect()
Unselects the current checkbox.
Returns: undefined
##rxForm.radioButton
Members
###radioButton.initialize(radioElement) Params
- radioElement
WebElement
- Should be an<input>
tag.
Returns: radioButton - Page object representing a radio button.
###radioButton.isSelected()
Abstraction over radioObject.rootElement.isSelected()
to keep things shorter.
Returns: boolean
- Whether or not the radio button is currently selected.
###radioButton.select()
Selects the current radio button.
Returns: undefined
##rxForm.form
Members
###form.fill(reference, formData)
Set value
in formData
to the page object's current method key
.
Aids in filling out form data via javascript objects.
For an example of this in use, see encore-ui's end to end tests.
Params
- reference
Object
- Context to evaluate under asthis
(typically,this
). - formData
Object
- Key-value pairs of deeply-nested form items, and their values to fill.
Example
yourPage.fill({
aTextbox: 'My Name',
aRadioButton: 'Second Option'
aSelectDropdown: 'My Choice'
aModule: {
hasMethods: 'Can Accept Input Too',
deepNesting: {
might: 'be overkill at this level'
}
}
});
#rxOptionFormTable Members
- rxOptionFormTable
- rxOptionFormTable.emptyMessage
- rxOptionFormTable.selectedRow
- rxOptionFormTable.columnNames
- rxOptionFormTable.selections
- rxOptionFormTable.disabledOptions
- rxOptionFormTable.isEmpty()
- rxOptionFormTable.columnData(columnName, [customFn])
- rxOptionFormTable.unselectAll()
- rxOptionFormTable.unselectByColumnText(columnName, columnText)
- rxOptionFormTable.unselectMany(selections)
- rxOptionFormTable.selectByColumnText(columnName, columnText)
- rxOptionFormTable.selectMany(selections)
- rxOptionFormTable.row
##rxOptionFormTable.emptyMessage
Returns: string
| null
- The currently displayed empty message label text, or null
if not present.
##rxOptionFormTable.selectedRow
Will default to the first selected row if many are selected.
Be certain you have a selected row before calling this, or a
NoSuchElementError will be thrown.
Returns: row - Page object representing a row.
##rxOptionFormTable.columnNames
Returns: Array.<string>
- Every column heading's text, as an array.
##rxOptionFormTable.selections
Return a list of row indexes that are currently selected.
Get the row yourself if you need more information about the row's contents.
Returns: Array.<number>
- All selected rows' indexes from the rxOptionFormTable.
##rxOptionFormTable.disabledOptions
Return a list of row indexes that are currently disabled.
Returns: Array.<number>
- All disabled row indexes from the rxOptionFormTable
##rxOptionFormTable.isEmpty()
Returns: boolean
- Whether or not the table's the empty message label is currently present.
##rxOptionFormTable.columnData(columnName, customFn)
Return the value of the cells found under columnName
, using getText
by default.
For more control, pass in a customFn
.
Params
- columnName
string
- Column name containing the cell elements to be retrieved. - [customFn=getText()]
function
- Special work to be done on the column's cell elements.
Returns: *
| Array.<string>
- Array of return values specified in customFn
, or an array of strings from getText()
Example
// three rows, with ['$0.00', '$1.00', '$2.00'] in their cells, respectively.
var penniesData = [0, 100, 200];
var penniesFn = function (cellElements) {
return cellElements.map(function (cellElement) {
return cellElement.getText().then(rxForm.currencyToPennies);
});
};
// without the second argument, each cell will have `.getText()` called on it
expect(optionTable.columnData('Surcharge', penniesFn)).to.eventually.eql(penniesData);
##rxOptionFormTable.unselectAll() Unselects every row in the rxOptionFormTable.
Returns: undefined
##rxOptionFormTable.unselectByColumnText(columnName, columnText)
Unselect a row by the columnName
that contains columnText
.
This function uses cssContainingText, be certain your column name and text is unique.
Params
- columnName
string
- Name of the column that contains the cell to select. - columnText
string
- Cell text that uniquely identifies the selection.
Returns: undefined
##rxOptionFormTable.unselectMany(selections)
Unselect options where each { columnName: columnText }
in selections
is passed to
unselectByColumnText.
Params
- selections
Array.<Object>
- Array of single key-value pairs to unselect.
Returns: undefined
Example
unselectMany([{ 'Name': 'Item 1' },
{ 'Name': 'Item 2' }]);
##rxOptionFormTable.selectByColumnText(columnName, columnText)
Select a row by the columnName
that contains columnText
.
This function uses cssContainingText, be certain your column name and text is unique.
Params
- columnName
string
- Name of the column that contains the cell to select. - columnText
string
- Cell text that uniquely identifies the selection.
Returns: undefined
##rxOptionFormTable.selectMany(selections)
Select options where each { columnName: columnText }
in selections
is passed to
selectByColumnText.
Params
- selections
Array.<Object>
- Array of single key-value pairs to select.
Returns: undefined
Example
selectMany([{ 'Name': 'Item 1' },
{ 'Name': 'Item 2' }]);
##rxOptionFormTable.row Params
- rowIndex
number
- Index of the row in the table.
Returns: row - Page object representing a row.
Members
###row.selectInput Since checkboxes are a superset of radio input elements, a checkbox is used.
Returns: checkbox - Page object representing a checkbox.
###row.isSelected()
Returns: boolean
- Whether or not the row is currently selected.
###row.isCurrent()
Returns: boolean
- Whether or not the row is visually marked as "current".
###row.cell(columnName, customFn)
Return the value of the cell by columnName
, using getText
by default.
For more control, pass in a customFn
.
The reason columnName
is used, as opposed to by binding, is due to some
complexity contained within the getContent
function in the rxOptionFormTable directive.
Link to the getContent
function.
There are columns that may contain static data (or expressions to be evaluated against $scope
)
for every row, and those data items are never bound to $scope
. Although the column.keys that are
passed into $scope.getContent
that contain angular expressions can be located by binding, there are
cases when plain text or HTML gets passed in. These never get bound to $scope
. They can, however,
be located by querying the column name via CSS selector, so that's used instead.
Params
- columnName
string
- Column name to grab the current row's cell under. - [customFn=getText()]
function
- Special work to be done to the resultingcellElement
.
###row.select() Selects the current row.
Returns: undefined
###row.unselect()
Unselects the current row.
Returns: undefined
#rxSortableColumn
Members
##rxSortableColumn.sort Prefer using sortAscending and sortDescending over this.
##rxSortableColumn.data
Returns: Array
- A list of all cell text in this column.
##rxSortableColumn.getDataUsing
Return a list of all cell contents in this column.
Passes all cell elements to customFn
, or if undefined, will return just the text of each cell.
The second argument, allByCssSelectorString
is used when your column's binding
(which is used by by.repeater().column
) is for some reason unreachable by protractor.
A common reason why this wouldn't be the case is because the binding is not used as text
within a web element, but instead used within the tag's attrs. An example of this is illustrated here:
Binding inside of a tag's attributes.
In these cases, you should specify a css selector that will select each element in the column you
care about, since by.binding
is not an option.
Params
- [customFn]
function
- Specific work that must occur to all column cell elements. - [allByCssSelectorString]
String
- Fallback$$('.all-by-css')
-style call to select column cells.
Returns: Array
- Dependent on the return value of customFn
.
Example
var sumCurrency = function (columnElements) {
return columnElements.reduce(function (acc, columnElement) {
return columnElement.getText().then(function (text) {
return acc + encore.rxForm.currencyToPennies(text);
});
}, 0);
};
charges.column('Usage Charges').getDataUsing(sumCurrency).then(function (sum) {
expect(currentUsage.estimate).to.eventually.equal(sum);
});
##rxSortableColumn.currentSortDirection The current sort direction of the column.
- Ascending sort: (1) means the arrow is pointed down. [0-9, a-z]
- Descending sort: (0) means the arrow is pointed up. [z-a, 9-0]
- Not sorted: (-1) means there is no arrow for this column.
Returns: Integer
- : 1, 0, or -1 based on direction.
Use sortDirections when testing your columns.
##rxSortableColumn.sortAscending()
Will repeatedly click the sort button until the column is sorted ascending.
Returns: undefined
##rxSortableColumn.sortDescending()
Will repeatedly click the sort button until the column is sorted descending.
Returns: undefined
#rxSortableColumns
Members
##rxSortableColumns.names
Return all column names in tableElement
.
If any special work needs to be done, pass in a custom mapFn
to getNamesUsing
instead.
Returns: Array
- : An array of strings representing text in each column in the table.
#rxStatusColumn
Members
##rxStatusColumn.byType Represents the custom defined status type. This has no relation to the tooltip text, the icon chosen, or the color used to represent it.
Returns: String
- Status cell's custom defined status type.
##rxStatusColumn.byIcon
Represents the status as summarized by the icon selection alone. Extracted from the font-awesome icon used.
Returns: String
- Status cell's font-awesome icon name.
##rxStatusColumn.byColor
Represents the status as summarized by the color selection alone. Extracted from the class name.
Returns: String
- Status cell's color class name.
##rxStatusColumn.tooltip
Will appear on hover.
Members
###tooltip.exists Hovers over the current row's status column and returns whether or not a tooltip appears.
Returns: Boolean
- Whether or not a tooltip is present.
###tooltip.text
Returns: String
- Tooltip text.