getCSSProperty
Ruft eine CSS-Eigenschaft von einem DOM-Element ab, das durch den angegebenen Selektor ausgewählt wurde. Der Rückgabewert ist so formatiert, dass er testbar ist. Farben werden über rgb2hex geparst und alle anderen Eigenschaften werden über css-value geparst.
Info
Beachten Sie, dass CSS-Kurzschreibweisen (z.B. background
, font
, border
, margin
,
padding
, list-style
, outline
, pause
, cue
) erweitert werden, um alle Langschreibweisen abzurufen,
was zu mehreren WebDriver-Aufrufen führt. Wenn Sie an einer bestimmten Langschreibweise
interessiert sind, wird empfohlen, stattdessen nach dieser zu fragen.
Usage
$(selector).getCSSProperty(cssProperty, pseudoElement)
Parameters
Name | Type | Details |
---|---|---|
cssProperty | string | CSS-Eigenschaftsname |
pseudoElement | PseudoElement | CSS-Pseudoelement |
Examples
example.html
<label id="myLabel" for="input" style="color: #0088cc; font-family: helvetica, arial, freesans, clean, sans-serif, width: 100px">Some Label</label>
getCSSProperty.js
it('should demonstrate the getCSSProperty command', async () => {
const elem = await $('#myLabel')
const color = await elem.getCSSProperty('color')
console.log(color)
// outputs the following:
// {
// property: 'color',
// value: 'rgba(0, 136, 204, 1)',
// parsed: {
// hex: '#0088cc',
// alpha: 1,
// type: 'color',
// rgba: 'rgba(0, 136, 204, 1)'
// }
// }
const font = await elem.getCSSProperty('font-family')
console.log(font)
// outputs the following:
// {
// property: 'font-family',
// value: 'helvetica',
// parsed: {
// value: [ 'helvetica', 'arial', 'freesans', 'clean', 'sans-serif' ],
// type: 'font',
// string: 'helvetica, arial, freesans, clean, sans-serif'
// }
// }
var width = await elem.getCSSProperty('width', '::before')
console.log(width)
// outputs the following:
// {
// property: 'width',
// value: '100px',
// parsed: {
// type: 'number',
// string: '100px',
// unit: 'px',
// value: 100
// }
// }
})
Returns
- <CSSProperty>
return
: Die angegebene CSS-Eigenschaft des Elements