Test that setting and getting justify-content works as expected

On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".


Test getting justify-content set through CSS
PASS getComputedStyle(justifyContentAuto, '').getPropertyValue('justify-content') is "normal"
PASS getComputedStyle(justifyContentBaseline, '').getPropertyValue('justify-content') is "baseline"
PASS getComputedStyle(justifyContentLastBaseline, '').getPropertyValue('justify-content') is "last-baseline"
PASS getComputedStyle(justifyContentSpaceBetween, '').getPropertyValue('justify-content') is "space-between"
PASS getComputedStyle(justifyContentSpaceAround, '').getPropertyValue('justify-content') is "space-around"
PASS getComputedStyle(justifyContentSpaceEvenly, '').getPropertyValue('justify-content') is "space-evenly"
PASS getComputedStyle(justifyContentStretch, '').getPropertyValue('justify-content') is "stretch"
PASS getComputedStyle(justifyContentStart, '').getPropertyValue('justify-content') is "start"
PASS getComputedStyle(justifyContentEnd, '').getPropertyValue('justify-content') is "end"
PASS getComputedStyle(justifyContentCenter, '').getPropertyValue('justify-content') is "center"
PASS getComputedStyle(justifyContentLeft, '').getPropertyValue('justify-content') is "left"
PASS getComputedStyle(justifyContentRight, '').getPropertyValue('justify-content') is "right"
PASS getComputedStyle(justifyContentFlexStart, '').getPropertyValue('justify-content') is "flex-start"
PASS getComputedStyle(justifyContentFlexEnd, '').getPropertyValue('justify-content') is "flex-end"
PASS getComputedStyle(justifyContentEndUnsafe, '').getPropertyValue('justify-content') is "end unsafe"
PASS getComputedStyle(justifyContentCenterUnsafe, '').getPropertyValue('justify-content') is "center unsafe"
PASS getComputedStyle(justifyContentRightSafe, '').getPropertyValue('justify-content') is "right safe"
PASS getComputedStyle(justifyContentLeftUnsafe, '').getPropertyValue('justify-content') is "left unsafe"
PASS getComputedStyle(justifyContentFlexStartUnsafe, '').getPropertyValue('justify-content') is "flex-start unsafe"
PASS getComputedStyle(justifyContentFlexEndSafe, '').getPropertyValue('justify-content') is "flex-end safe"
PASS getComputedStyle(justifyContentSpaceBetweenLeft, '').getPropertyValue('justify-content') is "space-between left"
PASS getComputedStyle(justifyContentSpaceAroundCenter, '').getPropertyValue('justify-content') is "space-around center"
PASS getComputedStyle(justifyContentSpaceEvenlyRight, '').getPropertyValue('justify-content') is "space-evenly right"
PASS getComputedStyle(justifyContentStretchStartSafe, '').getPropertyValue('justify-content') is "stretch start safe"
PASS getComputedStyle(justifyContentSpaceAroundEndUnsafe, '').getPropertyValue('justify-content') is "space-around end unsafe"
PASS getComputedStyle(justifyContentSpaceEvenlyFlexStartSafe, '').getPropertyValue('justify-content') is "space-evenly flex-start safe"
PASS getComputedStyle(justifyContentSpaceBetweenSafe, '').getPropertyValue('justify-content') is "normal"
PASS getComputedStyle(justifyContentSpaceBetweenStretch, '').getPropertyValue('justify-content') is "normal"
PASS getComputedStyle(justifyContentSafe, '').getPropertyValue('justify-content') is "normal"
PASS getComputedStyle(justifyContentRightSafeUnsafe, '').getPropertyValue('justify-content') is "normal"
PASS getComputedStyle(justifyContentCenterLeft, '').getPropertyValue('justify-content') is "normal"

Test initial value of justify-content through JS
PASS getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"

Test getting and setting justify-content through JS
PASS element.style.justifyContent is "center"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "center"
PASS element.style.justifyContent is "start unsafe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "start unsafe"
PASS element.style.justifyContent is "flex-end safe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "flex-end safe"
PASS element.style.justifyContent is "space-between right safe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "space-between right safe"
PASS element.style.justifyContent is "stretch center"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch center"
PASS element.style.justifyContent is "right unsafe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "right unsafe"
PASS element.style.justifyContent is "normal"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is "normal"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is "normal"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is "flex-end"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "flex-end"

Test bad combinations of justify-content
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"
PASS element.style.justifyContent is ""
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"

Test the value 'initial'
PASS element.style.justifyContent is "stretch center"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch center"
PASS element.style.justifyContent is "initial"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"

Test the value 'initial' for grid containers
PASS element.style.justifyContent is "space-between left"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "space-between left"
PASS element.style.justifyContent is "initial"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"

Test the value 'initial' for flex containers
PASS element.style.justifyContent is "right unsafe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "right unsafe"
PASS element.style.justifyContent is "initial"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "normal"

Test the value 'inherit'
PASS element.style.justifyContent is "end"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "end"
PASS element.style.justifyContent is "inherit"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "end"
PASS element.style.justifyContent is "left safe"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "left safe"
PASS element.style.justifyContent is "inherit"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "left safe"
PASS element.style.justifyContent is "stretch center"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch center"
PASS element.style.justifyContent is "inherit"
PASS window.getComputedStyle(element, '').getPropertyValue('justify-content') is "stretch center"
PASS successfullyParsed is true

TEST COMPLETE