--- /dev/null
+Copyright (c) 2012 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
--- /dev/null
+----------------------------------------------
+License
+----------------------------------------------
+Copyright (c) 2012 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ Lin, Wanming <wanmingx.lin@intel.com>
+
+
+
+----------------------------------------------
+Introduction
+----------------------------------------------
+This test suite is for testing CSS3 Flexible Box Layout (Partial) specification:
+http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/
+
+
+----------------------------------------------
+Test Environment
+----------------------------------------------
+1. Pre-install Testkit-Lite package.
+2. Run these cases as "normal" user.
+
+
+----------------------------------------------
+Build and Run
+----------------------------------------------
+(Suppose you only get the source code and Testkit-Lite has been set up on your test machine.
+ If you have obtained tct-flexiblebox-css3-tests ZIP packages, you can directly go to step 3 on the test machine;
+ if you have not installed Testkit-Lite, you need to install the latest version.)
+
+Steps:
+1. Prepare for building by running the following command:
+ cd tct-flexiblebox-css3-tests
+
+2. Build ZIP package by running the following command:
+ ./pack.sh
+
+3. Unzip the package on the test machine by running the following command:
+ unzip -o tct-flexiblebox-css3-tests-<version>.zip -d /home/owner/share/tct
+
+4. Install the package on the test machine by running the following command:
+ /home/owner/share/tct/opt/tct-flexiblebox-css3-tests/inst.sh
+
+5. Run test cases by running the following command on host:
+ testkit-lite -f device:/home/owner/share/tct/opt/tct-flexiblebox-css3-tests/tests.xml -e "WRTLauncher" -o tct-flexiblebox-css3-tests.results.xml
--- /dev/null
+<widget id='http://tizen.org/test/tct-flexiblebox-css3-tests' xmlns='http://www.w3.org/ns/widgets' xmlns:tizen='http://tizen.org/ns/widgets'>
+ <access origin="*"/>
+ <icon src="icon.png" height="117" width="117"/>
+ <name>tct-flexiblebox-css3-tests</name>
+ <tizen:application id="css3flexib.WebAPICSS3FlexibleboxTests" package="css3flexib" required_version="3.0"/>
+ <tizen:setting screen-orientation="landscape"/>
+</widget>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_align-content</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'align-content' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("align-content", div.style), "The align-content property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_align-items</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'align-items' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("align-items", div.style), "The align-items property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_align-self</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'align-self' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("align-self", div.style), "The align-self property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_flex-basis</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-basis' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-basis", div.style), "The flex-basis property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 FlexibleBox Test: CSS3FlexBox_flex-direction</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-direction' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-direction", div.style), "The flex-direction property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 FlexibleBox Test: CSS3FlexBox_flex-flow</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-flow' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-flow", div.style), "The flex-flow property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_flex-grow</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-grow' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-grow", div.style), "The flex-grow property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_flex-shrink</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-shrink' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-shrink", div.style), "The flex-shrink property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 FlexibleBox Test: CSS3FlexBox_flex-wrap</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex-wrap' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex-wrap", div.style), "The flex-wrap property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 FlexibleBox Test: CSS3FlexBox_flex</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'flex' property exists" />
+ <script src="support/flexiblebox.js"></script>
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("flex", div.style), "The flex property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2014 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ Cui,Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<meta charset="utf-8">
+<title>CSS3 Text Effects Test: the initial values</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/">
+<script src="../resources/testharness.js"></script>
+<script src="../resources/testharnessreport.js"></script>
+<link rel="stylesheet" href="../resources/testharness.css">
+<script src="support/flexiblebox.js"></script>
+<style>
+ #testDiv {
+ display: flex;
+ }
+</style>
+<div id="log"></div>
+<div id="testDiv"></div>
+<script>
+[
+ ["align-content", "stretch"],
+ ["align-items", "stretch"],
+ ["align-self", "stretch"],
+ ["flex", "0 1 auto"],
+ ["flex-basis", "auto"],
+ ["flex-grow", "0"],
+ ["flex-shrink", "1"],
+ ["justify-content", "flex-start"],
+ ["min-height", "0px"],
+ ["min-width", "0px"],
+ ["order", "0"]
+].forEach(function(attr) {
+ var name = attr[0];
+ var value = attr[1];
+
+ test(function() {
+ assert_equals(GetCurrentStyle(name), value, "The initial value of " + name);
+ }, "Check if the initial value of " + name + " is " + value);
+});
+
+</script>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_justify-content</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'justify-content' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("justify-content", div.style), "The justify-content property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_min-height</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#min-size-auto" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'min-height' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("min-height", div.style), "The min-height property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_min-width</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#min-size-auto" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'min-width' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("min-width", div.style), "The min-width property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ nianx.gan <nianx.gan@intel.com>
+ Cui, Jieqiong <jieqiongx.cui@intel.com>
+
+-->
+
+<html>
+ <head>
+ <title>CSS3 Text Effects Test: CSS3FlexBox_order</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the 'order' property exists" />
+ <script src="../resources/testharness.js"></script>
+ <script src="../resources/testharnessreport.js"></script>
+ <script src="support/flexiblebox.js"></script>
+ </head>
+ <body>
+ <div id="log"></div>
+ <script>
+ test(function () {
+ var div = document.getElementById("log");
+ assert_true(hasStyle("order", div.style), "The order property exists");
+ }, document.title);
+ </script>
+ </body>
+</html>
--- /dev/null
+This test suite comes from
+https://github.com/w3c/csswg-test
+with some modifications:
+1. add "-webkit-" prefix for 'flex','flex-wrap','flex-direction' properties.
+
+These tests are copyright by W3C and/or the author listed in the test
+file. The tests are dual-licensed under the W3C Test Suite License:
+http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
+and the BSD 3-clause License:
+http://www.w3.org/Consortium/Legal/2008/03-bsd-license
+under W3C's test suite licensing policy:
+http://www.w3.org/Consortium/Legal/2008/04-testsuite-copyright
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head><title>CSS Test: Change the value of 'order' property</title>
+
+<meta name="assert" content="The order of three should be blue-red-black" />
+
+<link rel="match" href="reference/Flexible-order-ref.html">
+<link rel="author" title="KeynesQu" href="mailto:keynesqu@sohu.com" />
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order" />
+
+<style>
+
+.box {
+ margin:0 auto;
+ background:#CCC;
+ border-radius:5px;
+ width:600px;
+ display:flex;
+ flex-flow:row;
+}
+
+.box div {
+ text-align:center;
+}
+
+.box .red {
+ order:-2;
+ flex:0 1 auto;
+ width:200px;
+ background:#F00;
+}
+.box .blue {
+ order:-4;
+ flex:0 1 auto;
+ width:200px;
+ background:#00F;
+}
+.box .black {
+ order:-1;
+ flex:0 1 auto;
+ width:200px;
+ background:#000;
+ color:#FFF;
+}
+
+
+
+
+</style>
+
+</head>
+
+<body>
+
+
+
+<p>The test passes if the order of the three boxes is blue-red-black</p>
+<!-- FLEX CONTAINER -->
+<div class="box">
+ <div class="red">A</div>
+ <div class="blue">B</div>
+ <div class="black">C</div>
+</div>
+
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'center'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: center' centers lines in the flex container." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, green 0, green 25px, red 25px, red 75px, green 75px, green 100px);
+ align-content: center;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 26px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'flex-start'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: flex-start' packs lines toward the start of the flex container." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, red 0, red 50px, green 50px, green 100px);
+ align-content: flex-start;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 26px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'flex-end'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: flex-end' packs lines toward the end of the flex container." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, green 0, green 50px, red 50px, red 100px);
+ align-content: flex-end;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 26px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'space-between'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: space-between' distributes lines evenly in the flex container." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: repeating-linear-gradient(to bottom, red 0, red 20px, green 20px, green 40px);
+ align-content: space-between;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 21px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'space-around'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: space-around' distributes lines evenly in the flex container, with half-size spaces on either end." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, green 0, green 15px, red 15px, red 35px, green 35px, green 65px, red 65px, red 85px, green 85px, green 100px);
+ align-content: space-around;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 22px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A multi-line flex container with the 'align-content' property set to 'stretch'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that a multi-line flex container with 'align-content: stretch' stretches lines to take up the remaining space." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: red;
+ align-content: center;
+ align-content: stretch;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_center</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the align-content value center." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in middle left of red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_flex-end</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the align-content value flex-end." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: flex-end;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in bottom left of red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_flex-start</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the align-content value flex-start." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: flex-start;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in upper left of red rectangle.</p>
+ <div id=log></div>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_space-around</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify align-content value space-around." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: space-around;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.<br>
+ 2. the rectangle 1, 2, 3 are distributed such that the empty space between any two adjacent rectangle is the same, and the empty space of the column before the first and after the last rectangle are half the size of the other empty spaces.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_space-between</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the display can recognize inline-flex value." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: space-between;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.<br>
+ 2. No gap between the top of red rectangle and the top of rectangle 1, no gap between the bottom of red rectangle and the bottom of rectangle 3 too, and rectangle 2 is distributed so that the empty space between rectangle 1 and rectangle 3 is the same.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: align-content_stretch</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the align-content value stretch." />
+ <style>
+ #test{
+ height: 200px;
+ width: 80px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: stretch;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle.<br>
+ 2. No gap between the top of red rectangle and the top of rectangle 1, and rectangle 1 , 2, 3 are distributed so that the empty space in the column between 1 , 2 , 3 is the same.
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'align-items' property set to 'center'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex container with 'align-items: center' centers each flex item's margin box in the cross-axis of its line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, green 0, green 25px, red 25px, red 75px, green 75px, green 100px);
+ align-items: center;
+ display: flex;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 52px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'align-items' property set to 'flex-start'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex container with 'align-items: flex-start' places each flex item's margin box flush with the cross-start edge of line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, red 0, red 50px, green 50px, green 100px);
+ align-items: center;
+ align-items: flex-start;
+ display: flex;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 51px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'align-items' property set to 'flex-end'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex container with 'align-items: flex-end' places each flex item's margin box flush with the cross-end edge of line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to bottom, green 0, green 50px, red 50px, red 100px);
+ align-items: center;
+ align-items: flex-end;
+ display: flex;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ height: 51px;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'align-items' property set to 'stretch'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items" />
+ <link rel="match" href="reference/align-content-001-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex container with 'align-items: stretch' places each flex item's margin box so that its cross size is the same as the cross size of the line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: red;
+ align-items: center;
+ align-items: stretch;
+ display: flex;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: green;
+ width: 150px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - flex-start</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'flex-start' aligns the flex items to the start edge of cross axis">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: flex-start;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ margin-top: -50px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - flex-end</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'flex-end' aligns the flex items to the end edge of cross axis">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: flex-end;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ margin-top: -100px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - center</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'center' centered the flex items in the cross axis within the line">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: center;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #top {
+ background-color: green;
+ margin-top: -100px;
+ height: 25px;
+ width: 100px;
+ }
+ #bottom {
+ background-color: green;
+ height: 25px;
+ margin-top: 50px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="top"></div>
+ <div id="bottom"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - stretch</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'stretch' makes the cross size of the item's margin box
+as close to the same size as the line as possible">
+<style>
+ #test {
+ align-items: center;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: stretch;
+ background-color: green;
+ width: 25px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - stretch (height: number)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'stretch' will be invalid while cross size of the flex item set exact number">
+<style>
+ #test {
+ background-color: green;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: stretch;
+ background-color: red;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ position: relative;
+ top: -100px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - baseline</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'baseline' aligns the flex items to the baseline of content">
+<style>
+ #test {
+ border: 1px solid black;
+ display: flex;
+ }
+ #test div {
+ align-self: baseline;
+ }
+ #div1 {
+ height: 90px;
+ font-size: 20px;
+ width: 30px;
+ }
+ #div2 {
+ height: 50px;
+ font-size: 10px;
+ width: 30px;
+ }
+ #div3 {
+ height: 100px;
+ font-size: 30px;
+ width: 30px;
+ }
+ #div4 {
+ height: 80px;
+ font-size: 15px;
+ width: 30px;
+ }
+</style>
+<body>
+ <p>Test passes if the underline of all 'a' characters within black border box is horizontal and no breaking.</p>
+ <div id="test">
+ <div id="div1"><a href="#">aaa</a></div>
+ <div id="div2"><a href="#">aaaaa</a></div>
+ <div id="div3"><a href="#">aa</a></div>
+ <div id="div4"><a href="#">aaa</a></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto and align-items - flex-start</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'auto' aligns flex items to start edge of cross-axis when 'align-items' set 'flex-start'">
+<style>
+ #test {
+ align-items: flex-start;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: auto;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ margin-top: -50px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto and align-items - flex-end</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'auto' aligns flex items to end edge of cross-axis when 'align-items' set 'flex-end'">
+<style>
+ #test {
+ align-items: flex-end;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: auto;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ margin-top: -100px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto and align-items - center</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'auto' will center flex items the flex items in the cross axis when 'align-items' set 'center'">
+<style>
+ #test {
+ align-items: center;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: auto;
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #top {
+ background-color: green;
+ margin-top: -100px;
+ height: 25px;
+ width: 100px;
+ }
+ #bottom {
+ background-color: green;
+ height: 25px;
+ margin-top: 50px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="top"></div>
+ <div id="bottom"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto and align-items - baseline</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'auto' aligns the flex items to the baseline of content when 'align-items' set 'baseline'">
+<style>
+ #test {
+ align-items: baseline;
+ border: 1px solid black;
+ display: flex;
+ }
+ #test div {
+ align-self: auto;
+ }
+ #div1 {
+ height: 90px;
+ font-size: 20px;
+ width: 30px;
+ }
+ #div2 {
+ height: 50px;
+ font-size: 10px;
+ width: 30px;
+ }
+ #div3 {
+ height: 100px;
+ font-size: 30px;
+ width: 30px;
+ }
+ #div4 {
+ height: 80px;
+ font-size: 15px;
+ width: 30px;
+ }
+</style>
+<body>
+ <p>Test passes if the underline of all 'a' characters within black border box is horizontal and no breaking.</p>
+ <div id="test">
+ <div id="div1"><a href="#">aaa</a></div>
+ <div id="div2"><a href="#">aaaaa</a></div>
+ <div id="div3"><a href="#">aa</a></div>
+ <div id="div4"><a href="#">aaa</a></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto and align-items - stretch</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property set 'auto' makes the cross size of the item's margin box
+as close to the same size as the line as possible when 'align-items' set 'stretch'">
+<style>
+ #test {
+ align-items: stretch;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ align-self: auto;
+ background-color: green;
+ width: 25px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - auto (initial value)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The initial value of 'align-self' property is 'auto'">
+<style>
+ #test {
+ align-items: stretch;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ width: 25px;
+ }
+ .auto {
+ align-self: auto;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div class="auto"></div>
+ <div class="auto"></div>
+ <div></div>
+ <div></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: align-self - invalid if applied to flex container</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-items-property" title="8.3. Cross-axis Alignment: the 'align-items' and 'align-self' properties">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-self" />
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'align-self' property is invalid if applied to flex container">
+<style>
+ #test {
+ align-items: flex-start;
+ align-self: flex-end;
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 50px;
+ margin-top: -50px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="test">
+ <div></div>
+ <div></div>
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<title>flexbox |css-box-justify-content</title>
+<link rel="author" href="ava656094@gmail.com" title="xiaoxia">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="match" href="reference/css-box-justify-content-ref.html">
+<style>
+#flexbox {
+ background: green;
+ width: 300px;
+ height: 40px;
+ display: flex;
+ flex-flow: row;
+ justify-content: flex-end;
+}
+.item{
+ width:50px;
+ height: 30px;
+ }
+</style>
+
+<p>This test passes if the DIV5's position in the end and the div is Horizontal layout</p>
+<div id="flexbox">
+ <div class="item" style="background-color: rgb(242, 210, 80); color: rgb(41, 119, 248);">DIV1</div>
+
+ <div class="item" style="background-color: rgb(110, 8, 7); color: rgb(162, 152, 22);">DIV2</div>
+
+ <div class="item" style="background-color: rgb(215, 172, 243); color: rgb(74, 123, 110);">DIV3</div>
+
+ <div class="item" style="background-color: rgb(242, 133, 80); color: rgb(41, 119, 248);">DIV4</div>
+
+ <div class="item" style="background-color: rgb(242, 50, 80); color: rgb(41, 119, 248);">DIV5</div>
+</div>
--- /dev/null
+<!DOCTYPE HTML>
+<html>
+<head>
+ <title>CSS Flexbox Test: Items stretch correctly while content is animating</title>
+ <link rel="author" title="Micky Brunetti" href="mailto:micky2be@gmail.com">
+ <style>
+ @keyframes resize {
+ 0% {height: 100px;}
+ 100% {height: 50px;}
+ }
+ .test {
+ height: 100px;
+ width: 200px;
+ background-color: green;
+ animation: resize 500ms infinite alternate;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passes if you keep seeing a green rectangle and no red.</p>
+ <div class="test"></div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE HTML>
+<html>
+<head>
+ <title>CSS Flexbox Test: Items stretch correctly while content is animating</title>
+ <link rel="author" title="Micky Brunetti" href="mailto:micky2be@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-align-items">
+ <link rel="match" href="css-flexbox-height-animation-stretch-ref.html"/>
+ <meta name="flags" content="">
+ <meta name="assert" content="Items should stretch vertically in all time">
+ <style>
+ @keyframes resize {
+ 0% {height: 100px;}
+ 100% {height: 50px;}
+ }
+ .container {
+ display: flex;
+ width: 200px;
+ background-color: red;
+
+ }
+ .item {
+ background-color: green;
+ width: 50px;
+
+ }
+ .content {
+ height: 50px;
+ }
+ .bigger.content {
+ height: 100px;
+ animation: resize 500ms infinite alternate;
+ }
+ </style>
+</head>
+<body>
+<p>The test passes if you keep seeing a green rectangle and no red.</p>
+<div class="test">
+ <div class="container">
+ <div class="item"><div class="bigger content"></div></div>
+ <div class="item"><div class="content"></div></div>
+ <div class="item"><div class="content"></div></div>
+ <div class="item"><div class="content"></div></div>
+ </div>
+</div>
+</div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: Image Expansion</title>
+ <link rel="author" title="Eiji Kitamura" href="mailto:agektmr@gmail.com">
+ <!-- You must have at least one spec link, but may have as many as are covered in the test. -->
+ <!-- Be sure to make the main testing area first in the order -->
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow">
+ <!-- The match link is only required if this is a reftest -->
+ <link rel="match" href="reference/css-flexbox-img-expand-evenly-ref.html">
+ <meta name="flags" content="">
+ <meta name="assert" content="3 rectangular images fill out border.">
+ <style type="text/css">
+
+ /* ADD STYLE BLOCK HERE (PREFERRABLE TO INLINE STYLES) */
+ div.flexbox {
+ height: 50px;
+ width: 300px;
+ border: 2px dotted black;
+ display: flex;
+ }
+ img {
+ width: 48px;
+ flex-grow: 1;
+ background: purple;
+ border: 1px solid white;
+ }
+
+ </style>
+</head>
+<body>
+ <p>3 rectangular images fill out border.</p>
+
+ <!-- PAGE CONTENT -->
+ <div class="flexbox">
+ <img src="../support/solidblue.png" />
+ <img src="../support/solidblue.png" />
+ <img src="../support/solidblue.png" />
+ </div>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <meta charset="utf-8" />
+ <title>CSS Reftest Reference</title>
+ <link rel="author" title="Tsutomu ogaoga Ogasawara" href="mailto:info@ogaoga.org">
+ <style type="text/css">
+ .container {
+ color: white;
+ }
+ .item {
+ -webkit-writing-mode: vertical-rl;
+ writing-mode: vertical-rl;
+ background: green;
+ height: 3em;
+ width: 3em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passes if you see a tall green box with pairs of the 1-9 and a-i listed top to bottom in two columns.</p>
+
+ <div class="container">
+ <div class="item">１２３<br />ａｂｃ</div>
+ <div class="item">４５６<br />ｄｅｆ</div>
+ <div class="item">７８９<br />ｇｈｉ</div>
+ </div>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\r
+<html xmlns="http://www.w3.org/1999/xhtml">\r
+ <head>\r
+ <title>CSS Test: An element with the 'display' property set to 'flex'</title>\r
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />\r
+ <link rel="author" title="Qunfang Lin" href="qunfang.lin@samsung.com"/>\r
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-containers" />\r
+ <meta name="flags" content=""/>\r
+ <meta name="assert" content="This test checks that an element with 'display' property set to 'flex' establishes a new block-level flex container." />\r
+ <style type="text/css">\r
+ #parent\r
+ {\r
+ position: relative;\r
+ }\r
+ div div\r
+ {\r
+ display: flex;\r
+ flex-flow: row;\r
+ }\r
+ div p\r
+ {\r
+ background-color: green;\r
+ margin: 0;\r
+ }\r
+ span\r
+ {\r
+ background-color: red;\r
+ left: 50px;\r
+ position: absolute;\r
+ z-index: -1;\r
+ }\r
+ span, div p\r
+ {\r
+ height: 50px;\r
+ width: 50px;\r
+ }\r
+ </style>\r
+ </head>\r
+ <body>\r
+ <p>Test passes if there is no red visible on the page.</p>\r
+ <div id="parent">\r
+ <span></span>\r
+ <div>\r
+ <p></p>\r
+ <p></p>\r
+ </div>\r
+ </div>\r
+ </body>\r
+</html>\r
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: display_flex</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers" />
+ <meta name="flags" content="dom" />
+ <meta name="assert" content="Check if the web engine can indenfy the display value flex." />
+ <style>
+ div#test{
+ display: flex;
+ }
+ </style>
+ <script src="../../resources/testharness.js"></script>
+ <script src="../../resources/testharnessreport.js"></script>
+ </head>
+ <body>
+ <div id=log></div>
+ <div id=test></div>
+ <script type="text/javascript">
+ var t = async_test(document.title, {timeout:500});
+ t.step(function () {
+ assert_equals(window.getComputedStyle(document.querySelector('div#test')).display, "flex", "Display value is");
+ t.done();
+ });
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: display_inline-flex</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers" />
+ <meta name="flags" content="dom" />
+ <meta name="assert" content="Check if the web engine can identify the display value inline-flex." />
+ <style>
+ div#test{
+ display: inline-flex;
+ }
+ </style>
+ <script src="../../resources/testharness.js"></script>
+ <script src="../../resources/testharnessreport.js"></script>
+ </head>
+ <body>
+ <div id=log></div>
+ <div id=test></div>
+ <script type="text/javascript">
+ var t = async_test(document.title, {timeout:500});
+ t.step(function () {
+ assert_equals(window.getComputedStyle(document.querySelector('div#test')).display, "inline-flex", "Display value is");
+ });
+ t.done();
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: The 'flex' shorthand adjusting the 'flex-grow' sub-property</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex grow factor determines the distribution of positive free space."/>
+ <style type="text/css">
+ #flexbox
+ {
+ background-color: red;
+ display: flex;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ flex: 1 0 auto;
+ height: 100px;
+ }
+ #flexItem1
+ {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="flexItem1"></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: The 'flex' shorthand adjusting the 'flex-shrink' sub-property</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex shrink factor is multiplied by the flex base size when distributing negative space."/>
+ <style type="text/css">
+ div
+ {
+ height: 50px;
+ }
+ #flexbox
+ {
+ background-color: red;
+ display: flex;
+ width: 150px;
+ }
+ #flexItem1
+ {
+ flex: 0 2 auto;
+ width: 150px;
+ }
+ #flexItem2
+ {
+ width: 100px;
+ }
+ #flexItem1, #ref1
+ {
+ background-color: blue;
+ }
+ #flexItem2, #ref2
+ {
+ background-color: orange;
+ }
+ #ref1, #ref2
+ {
+ display: inline-block;
+ width: 75px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="flexItem1"></div>
+ <div id="flexItem2"></div>
+ </div>
+ <div id="ref1"></div><div id="ref2"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: Comparing two different elements using different values for the 'flex-grow' sub-property on the 'flex' shorthand</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex items with a different flex grow factor have different flexibilities."/>
+ <style type="text/css">
+ div
+ {
+ height: 50px;
+ }
+ #flexbox
+ {
+ background-color: red;
+ display: flex;
+ width: 150px;
+ }
+ #flexItem1
+ {
+ flex: 1 0 auto;
+ width: 50px;
+ }
+ #flexItem2
+ {
+ flex: 2 0 auto;
+ width: 25px;
+ }
+ #flexItem1, #ref1
+ {
+ background-color: blue;
+ }
+ #flexItem2, #ref2
+ {
+ background-color: orange;
+ }
+ #ref1, #ref2
+ {
+ display: inline-block;
+ width: 75px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="flexItem1"></div>
+ <div id="flexItem2"></div>
+ </div>
+ <div id="ref1"></div><div id="ref2"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: Comparing two different elements using different values for the 'flex-shrink' sub-property on the 'flex' shorthand</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex items with a different flex shrink factor have different flexibilities."/>
+ <style type="text/css">
+ div
+ {
+ height: 50px;
+ }
+ #flexbox
+ {
+ background-color: red;
+ display: flex;
+ width: 150px;
+ }
+ #flexItem1
+ {
+ flex: 0 2 auto;
+ width: 150px;
+ }
+ #flexItem2
+ {
+ flex: 0 3 auto;
+ width: 300px;
+ }
+ #flexItem1, #ref1
+ {
+ background-color: blue;
+ }
+ #flexItem2, #ref2
+ {
+ background-color: orange;
+ }
+ #ref1, #ref2
+ {
+ display: inline-block;
+ width: 75px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="flexItem1"></div>
+ <div id="flexItem2"></div>
+ </div>
+ <div id="ref1"></div><div id="ref2"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flex-basis Test</title>
+ <link rel="author" title="Chunsheng Zhang" href="mailto:zhangcs_423@163.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#alignment" />
+ <link rel="match" href="reference/flex-align-items-center-ref.html" />
+ <meta name="assert" content="flex items center" />
+ <style type="text/css">
+ #container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: 5px solid green;
+ width: 600px;
+ height: 200px;
+ padding: 5px;
+ border-radius: 3px;
+ position: absolute;
+ top: 70px;
+ left: 10px;
+ }
+ #container > div {
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ padding: 10px;
+ width: 30px;
+ height: 40px;
+ text-align: center;
+ flex: none;
+ }
+ #fail-flag {
+ position: absolute;
+ top: 162px;
+ left: 272px;
+ width: 92px;
+ height: 36px;
+ background: red;
+ }
+ </style>
+ </head>
+ <body>
+ <p>This case tests that flex items center</p>
+ <p>The test passes if there is no red</p>
+ <div id="fail-flag"></div>
+ <section id="container">
+ <div></div>
+ <div></div>
+ <div></div>
+ </section>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: Aspect ratio handling of images</title>
+ <link rel="author" title="Google Inc." href="http://www.google.com/" />
+ <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#hypothetical-main-size" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <style type="text/css">
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ flex-direction: column;
+ height: 10px;
+ }
+
+ img {
+ min-width: 0;
+ min-height: 0;
+ flex: none;
+ width: 100px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img id="test-flex-item-overlapping-green" src="../support/200x200-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: Aspect ratio handling of images</title>
+ <link rel="author" title="Google Inc." href="http://www.google.com/" />
+ <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#algo-cross-item" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Test that we compute the correct aspect-ratio based cross size when a height is specified" />
+ <style type="text/css">
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ flex-direction: column;
+ height: 10px;
+ }
+
+ img {
+ min-width: 0;
+ min-height: 0;
+ flex: none;
+ height: 100px;
+ align-self: flex-start;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img id="test-flex-item-overlapping-green" src="../support/200x200-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: Aspect ratio handling of images</title>
+ <link rel="author" title="Google Inc." href="http://www.google.com/" />
+ <link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#hypothetical-main-size" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <style type="text/css">
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ width: 10px;
+ }
+
+ img {
+ min-width: 0;
+ min-height: 0;
+ flex: none;
+ height: 100px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img id="test-flex-item-overlapping-green" src="../support/200x200-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - positive number</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set positive number, the actual value of test element size is same as the positive number">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ background-color: green;
+ height: 100px;
+ }
+ #test {
+ flex-basis: 60px;
+ }
+ #ref {
+ width: 40px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ <div id="ref"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - positive number</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property specified correct value, the actual value of test element size is same as to the value of 'flex-basis' property, and the 'width' property is invalid.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ height: 100px;
+ }
+ #test {
+ flex-basis: 60px;
+ width: 80px;
+ }
+ #ref {
+ background-color: green;
+ width: 40px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 60px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ <div id="ref"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - negative number(width not specified)</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set negative number, the tested element is not shown when width not set either.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ height: 100px;
+ }
+ #test {
+ flex-basis: -50px;
+ }
+ #ref {
+ background-color: green;
+ width: 50px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-left: 50px;
+ margin-top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ <div id="ref"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - negative number(width specified)</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set negative number, the actual width of tested element is
+same as the value of 'width' property specified.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ background-color: green;
+ height: 100px;
+ }
+ #test {
+ flex-basis: -50px;
+ width: 30px;
+ }
+ #ref {
+ width: 50px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-left: 80px;
+ margin-top: -100px;
+ width: 20px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ <div id="ref"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - 0</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set '0', the actual width of tested element is same as 0.">
+<style>
+ #container {
+ background-color: green;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test {
+ background-color: red;
+ flex-basis: 0;
+ height: 100px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - 0%</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set '0%', the actual width of tested element is same as 0.">
+<style>
+ #container {
+ background-color: green;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #test {
+ background-color: red;
+ flex-basis: 0%;
+ height: 100px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - auto</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set 'auto', the actual width of tested element same as the value which specified by width property.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ background-color: green;
+ height: 100px;
+ }
+ #ref {
+ width: 50px;
+ }
+ #test {
+ flex-basis: auto;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test"></div>
+ <div id="ref"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-basis - 50%</title>
+<link rel="author" href="Intel" title="http://www.intel.com">
+<link rel="author" href="Intel" title="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.3. The 'flex-basis' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-basis">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-basis' property set positive percentage, the actual width of tested element same as the percentage of flex container size.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div{
+ background-color: green;
+ height: 100px;
+ }
+ #ref {
+ width: 40px;
+ }
+ #test {
+ flex-basis: 60%;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="ref"></div>
+ <div id="test"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex-container-margin-not-collapse-with-content-margin</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#item-margins">
+<link rel="match" href="reference/flex-container-margin-ref.html">
+<meta name="assert" content="The margins of adjacent flex items do not collapse." />
+<style>
+ .flex-container{
+ display: flex;
+ margin:20px;
+ background: #333;
+ }
+ .flex-item{
+ width:50px;
+ height:50px;
+ margin:20px;
+ background: #eee;
+ }
+</style>
+</head>
+<body>
+ <div class="flex-container">
+ <div class="flex-item"></div>
+ <div class="flex-item"></div>
+ <div class="flex-item"></div>
+ </div>
+ <div>Test pass if the margins of adjacent flex items do not collapse.</div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex-direction: column-reverse swaps main start and end directions</title>
+ <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com">
+ <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that column-reverse flex-direction swaps the main start and main end directions">
+ <style>
+ .test {
+ display: flex;
+ float:left;
+ height: 3em;
+ }
+
+ .test > span {
+ height: 1em;
+ }
+
+ #column {
+ flex-direction: column;
+ }
+
+ #column-reverse {
+ flex-direction: column-reverse;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if both the two columns below are identical.</p>
+ <div class="test" id="column">
+ <span>A</span><span>B</span><span>C</span>
+ </div>
+ <div class="test" id="column-reverse">
+ <span>C</span><span>B</span><span>A</span>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="match" href="reference/flex-direction-modify.html">
+<meta name="assert" content="Changing 'flex-direction' with JavaScript and then changing it back should returns to the original look." />
+<style>
+ .flex-container{
+ display: flex;
+ margin:20px;
+ background: #333;
+ }
+ .flex-item{
+ width:50px;
+ height:50px;
+ margin:20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+
+ .flex-container.flex-direction-row-reverse{
+ flex-direction : row-reverse;
+ }
+
+ .flex-container.flex-direction-column{
+ flex-direction : column;
+ }
+ .flex-container.flex-direction-column-reverse{
+ flex-direction : column-reverse;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:<span id="current_direction">row</h1>
+ <div id="flex_container" class="flex-container"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <script>
+ var container = document.getElementById("flex_container");
+ var direction_text = document.getElementById("current_direction");
+ var baseClass = "flex-container ";
+ var classPrefix = "flex-direction-";
+ function change_direction( direction ){
+ container.className = baseClass + classPrefix + direction;
+ notify( direction );
+ }
+
+ function notify( direction ){
+ direction_text.innerHTML = direction;
+ }
+
+ change_direction("row");
+ change_direction("row-reverse");
+ change_direction("column");
+ change_direction("row-column-reverse");
+ change_direction("row");
+ </script>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flow-direction:row-reverse swaps main start and end directions</title>
+ <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com">
+ <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that row-reverse flex-direction swaps the main start and main end directions">
+ <style>
+ .test {
+ display: flex;
+ width: 3em;
+ }
+
+ .test > span {
+ width: 1em;
+ }
+
+ #row {
+ flex-direction: row;
+ }
+
+ #row-reverse {
+ flex-direction: row-reverse;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if both the lines below are identical.</p>
+ <div class="test" id="row">
+ <span>A</span><span>B</span><span>C</span>
+ </div>
+ <div class="test" id="row-reverse">
+ <span>C</span><span>B</span><span>A</span>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex-direction:row axis matches that of writing mode inline axis</title>
+ <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com">
+ <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the main axis of the row flex-direction has the same orientation as the inline axis of the current writing mode">
+ <style>
+
+ .test {
+ display: flex;
+ width: 3em;
+ flex-direction :row;
+ }
+
+ .test > span {
+ width: 1em;
+ direction: ltr;
+ }
+
+ #row-ltr {
+ direction: ltr;
+ }
+
+ #row-rtl {
+ direction: rtl;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if both the lines below are identical.</p>
+ <div class="test" id="row-ltr">
+ <span>A</span><span>B</span><span>C</span>
+ </div>
+ <div class="test" id="row-rtl">
+ <span>C</span><span>B</span><span>A</span>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="match" href="reference/flex-direction-with-element-insert.html">
+<meta name="assert" content="The flex items inserted by script shuould follow the right direction what the flex-direction property directives." />
+<style>
+ .flex-container{
+ display: flex;
+ margin:20px;
+ background: #333;
+ }
+ .flex-item{
+ width:50px;
+ height:50px;
+ margin:20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+
+ .flex-container.flex-direction-row-reverse{
+ flex-direction : row-reverse;
+ }
+
+ .flex-container.flex-direction-column{
+ flex-direction : column;
+ }
+ .flex-container.flex-direction-column-reverse{
+ flex-direction : column-reverse;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:row</h1>
+ <div id="flex-direction-row" class="flex-container flex-direction-row"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:row-reverse</h1>
+ <div id="flex-direction-row-reverse" class="flex-container flex-direction-row-reverse"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:column</h1>
+ <div id="flex-direction-column" class="flex-container flex-direction-column"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:column-reverse</h1>
+ <div id="flex-direction-column-reverse" class="flex-container flex-direction-column-reverse"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+
+ <script>
+ var ids = ['flex-direction-row',
+ 'flex-direction-row-reverse',
+ 'flex-direction-column',
+ 'flex-direction-column-reverse'];
+
+ for( var i in ids ){
+ var new_element = document.createElement("div")
+ new_element.className="flex-item";
+ new_element.innerHTML="new";
+ var container = document.getElementById( ids[i] );
+ container.appendChild( new_element );
+ }
+ </script>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="match" href="reference/flex-direction.html">
+<meta name="assert" content="The flow of flex items in the the flex container should observe the flex-direction property." />
+<style>
+ .flex-container{
+ display: flex;
+ margin:20px;
+ background: #333;
+ }
+ .flex-item{
+ width:50px;
+ height:50px;
+ margin:20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+
+ .flex-container.flex-direction-row-reverse{
+ flex-direction : row-reverse;
+ }
+
+ .flex-container.flex-direction-column{
+ flex-direction : column;
+ }
+ .flex-container.flex-direction-column-reverse{
+ flex-direction : column-reverse;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:row</h1>
+ <div class="flex-container flex-direction-row"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:row-reverse</h1>
+ <div class="flex-container flex-direction-row-reverse"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:column</h1>
+ <div class="flex-container flex-direction-column"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:column-reverse</h1>
+ <div class="flex-container flex-direction-column-reverse"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-direction_column-reverse</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-direction value column-reverse." />
+ <style>
+ #test{
+ height: 200px;
+ width: 200px;
+ display: flex;
+ flex-direction: column-reverse;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in bottom left of red rectangle and from top to bottom of the column: 3, 2, 1.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-direction_column</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-direction value column." />
+ <style>
+ #test{
+ height: 200px;
+ width: 200px;
+ display: flex;
+ flex-direction: column;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a vertical column in a red rectangle and no gap between them.<br>
+ 2. They are all appear in upper left of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-direction_row-reverse</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-direction value row-reverse." />
+ <style>
+ #test{
+ height: 200px;
+ width: 200px;
+ display: flex;
+ flex-direction: row-reverse;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in upper right of red rectangle and from left to right of the row: 3, 2, 1.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-direction_row</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-direction value row." />
+ <style>
+ #test{
+ height: 200px;
+ width: 200px;
+ display: flex;
+ flex-direction: row;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in upper left of red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test Reference File</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ div {
+ background-color: green;
+ float: left;
+ height: 50px;
+ width: 25px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green rectangle whose width is greater than height
+ and the number within rectangle is '1 2 3 4' from left to right.</p>
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row nowrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-001-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row nowrap' controls the flex container is single-line">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row nowrap;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green rectangle whose width is greater than height
+ and the number within rectangle is '1 2 3 4' from left to right.</p>
+ <div id="test">
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test Reference File</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+ .float {
+ margin-left: 50px;
+ margin-top: -50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div>1</div>
+ <div class="float">2</div>
+ <div>3</div>
+ <div class="float">4</div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row wrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row wrap' controls the flex container is multi-line">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row wrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row wrap-reverse</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row wrap-reverse' controls the flex container is multi-line
+but the cross-start and cross-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row wrap-reverse;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>3</div>
+ <div>4</div>
+ <div>1</div>
+ <div>2</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row-reverse nowrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-001-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row-reverse nowrap' controls the flex container is single-line,
+but the main-start and main-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row-reverse nowrap;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green rectangle whose width is greater than height
+ and the number within rectangle is '1 2 3 4' from left to right.</p>
+ <div id="test">
+ <div>4</div>
+ <div>3</div>
+ <div>2</div>
+ <div>1</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row-reverse wrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row-reverse wrap' controls the flex container is multi-line
+but the main-start and main-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row-reverse wrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>2</div>
+ <div>1</div>
+ <div>4</div>
+ <div>3</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - row-reverse wrap-reverse</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'row-reverse wrap-reverse' controls the flex container is multi-line
+but the main-start and main-end, cross-start and cross-end directions are all swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: row-reverse wrap-reverse;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>4</div>
+ <div>3</div>
+ <div>2</div>
+ <div>1</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test Reference File</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ div {
+ background-color: green;
+ height: 25px;
+ width: 100px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' from top to bottom.</p>
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column nowrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-007-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column nowrap' controls the flex container is single-line,
+but the main axis is vertical">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column nowrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' from top to bottom.</p>
+ <div id="test">
+ <div>1</div>
+ <div>2</div>
+ <div>3</div>
+ <div>4</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column wrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column wrap' controls the flex container is multi-line
+but the main axis is vertical">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column wrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>1</div>
+ <div>3</div>
+ <div>2</div>
+ <div>4</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column wrap-reverse</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column wrap-reverse' controls the flex container is multi-line
+but the main axis is vertical, the cross-start and cross-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column wrap-reverse;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>2</div>
+ <div>4</div>
+ <div>1</div>
+ <div>3</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column-reverse nowrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-007-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column-reverse nowrap' controls the flex container is single-line,
+but the main axis is vertical, the main-start and main-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column-reverse nowrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and no red, the number within square is '1 2 3 4' from top to bottom.</p>
+ <div id="test">
+ <div>4</div>
+ <div>3</div>
+ <div>2</div>
+ <div>1</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column-reverse wrap</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column-reverse wrap' controls the flex container is multi-line
+but the main axis is vertical, the main-start and main-end directions are swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column-reverse wrap;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>3</div>
+ <div>1</div>
+ <div>4</div>
+ <div>2</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-flow - column-reverse wrap-reverse</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="5.3. Flex Direction and Wrap: the 'flex-flow' shorthand" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-flow">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction">
+<link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+<link rel="match" href="flex-flow-002-ref.html">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-flow' property set 'column-reverse wrap-reverse' controls the flex container is multi-line
+but the main axis is vertical, the 'cross-start/cross-end' and 'main-start/main-end' directions are all swapped">
+<style>
+ #test {
+ background-color: red;
+ display: flex;
+ flex-flow: column-reverse wrap-reverse;
+ height: 100px;
+ width: 100px;
+ }
+ #test div {
+ background-color: green;
+ height: 50px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>, the number within square is '1 2 3 4'
+ from left to right, top to bottom.</p>
+ <div id="test">
+ <div>4</div>
+ <div>2</div>
+ <div>3</div>
+ <div>1</div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Reftest Reference</title>
+ <link rel="author" title="Hanrui Gao" href="mailto:hanrui.gao@gmail.com"/>
+ <style type="text/css"><![CDATA[
+ #container {
+ width: 240px;
+ height: 60px;
+ border: 1px solid #000;
+ }
+ #container > div {
+ height: 100%;
+ float: left;
+ }
+ #child_1 {
+ width: 30px;
+ background-color: green;
+ }
+ #child_2 {
+ width: 80px;
+ background-color: blue;
+ }
+ #child_3 {
+ width: 130px;
+ background-color: gray;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <div id="container">
+ <div id="child_1"></div>
+ <div id="child_2"></div>
+ <div id="child_3"></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: Flex-grow Property of Block-level Flex Items</title>
+ <link rel="author" title="Hanrui Gao" href="mailto:hanrui.gao@gmail.com"/>
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow"/>
+ <link rel="match" href="flex-grow-001-ref.xht"/>
+ <meta name="flags" content="" />
+ <meta name="assert" content="'flex-grow' property specifies the flex grow factor, which determines how much the flex item will grow relative to the rest of the flex items in the flex container when positive free space is distributed." />
+ <style type="text/css"><![CDATA[
+ #container {
+ width: 240px;
+ height: 60px;
+ border: 1px solid #000;
+ display: flex;
+ }
+ #container > div {
+ width: 30px;
+ height: 100%;
+ }
+ #child_1 {
+ flex-grow: 0;
+ background-color: green;
+ }
+ #child_2 {
+ flex-grow: 1;
+ background-color: blue;
+ }
+ #child_3 {
+ flex-grow: 2;
+ background-color: gray;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if the green box is smaller than the blue one and blue box is smaller than the gray one</p>
+ <div id="container">
+ <div id="child_1"></div>
+ <div id="child_2"></div>
+ <div id="child_3"></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-grow - 0(initial value)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.1. The 'flex-grow' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-grow' property initial value is '0', the flex item will keep the width when 'flex-grow' set '0'">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 20px;
+ }
+ #test1 {
+ background-color: green;
+ flex-grow: 1;
+ }
+ #test2 {
+ background-color: green;
+ flex-grow: 0;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-left: 80px;
+ margin-top: -100px;
+ width: 20px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ <div id="test3"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-grow - negative number</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.1. The 'flex-grow' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-grow' property set negative number, the flex item will not grow.">
+<style>
+ #container {
+ background-color: green;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ background-color: red;
+ height: 100px;
+ }
+ #test1 {
+ flex-grow: -2;
+ width: 25px;
+ }
+ #test2 {
+ flex-grow: -3;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ position: relative;
+ top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-grow - (invalid when no space distributed)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.1. The 'flex-grow' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-grow' property is invalid when the flex container has no space distributed.">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ }
+ #test1 {
+ flex-grow: 3;
+ width: 50px;
+ }
+ #test2 {
+ background-color: green;
+ flex-grow: 2;
+ width: 50px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ position: relative;
+ top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-grow - (invalid when applied to flex container)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.1. The 'flex-grow' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-grow">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The 'flex-grow' property is invalid when the property applied to flex container.">
+<style>
+ #container {
+ background-color: green;
+ display: flex;
+ flex-grow: 2;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ background-color: red;
+ height: 100px;
+ width: 25px;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ position: relative;
+ top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div></div>
+ <div></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flex-basis Test</title>
+ <link rel="author" title="Chunsheng Zhang" href="mailto:zhangcs_423@163.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flexibility" />
+ <link rel="match" href="reference/flex-items-flexibility.html" />
+ <meta name="assert" content="flex items flexibility" />
+ <style type="text/css">
+ #container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: 5px solid green;
+ width: 600px;
+ height: 200px;
+ padding: 5px;
+ border-radius: 3px;
+ position: absolute;
+ top: 70px;
+ left: 10px;
+ }
+ div {
+ padding: 10px;
+ width: 30px;
+ height: 40px;
+ text-align: center;
+ flex: 1 0 auto;
+ }
+ #flex {
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ flex: 2 0 auto;
+ }
+ #fail-flag {
+ position: absolute;
+ padding: 10px;
+ top: 150px;
+ left: 183px;
+ width: 254px;
+ height: 40px;
+ background: red;
+ }
+ </style>
+ </head>
+ <body>
+ <p>This case tests that flex items flexibility</p>
+ <p>The test passes if there is no red</p>
+ <div id="fail-flag"></div>
+ <section id="container">
+ <div></div>
+ <div id="flex"></div>
+ <div></div>
+ </section>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex item margins</title>
+ <link rel="author" title="Ping Huang" href="mailto:phuangce@gmail.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-direction">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#item-margins">
+ <link rel="match" href="reference/flex-margin-no-collapse-ref.html">
+ <meta name="assert" content="The vertical gap between two green boxs should be 100px." />
+ <style type="text/css">
+ #container {
+ display: flex ;
+ flex-direction: column;
+ position: absolute;
+ top: 100px;
+ left: 10px;
+ width: 200px;
+ height: 300px;
+ }
+
+ .box {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+ flex: none;
+ }
+
+ #box1 {
+ margin: 50px 0;
+ }
+
+ #box2 {
+ margin: 50px 0;
+ }
+
+ #red-box {
+ position: absolute;
+ top: 350px;
+ left: 10px;
+ width: 100px;
+ height: 100px;
+ background-color: red;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passes if there are two green boxes and no red.</p>
+ <div id="red-box"></div>
+ <div id="container">
+ <div id="box1" class="box"></div>
+ <div id="box2" class="box"></div>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Flexible Box Test: Minimum height of flex items</title>
+ <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Checks that minimum height for flex items is the min-content size." />
+ <style type="text/css"><![CDATA[
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ flex-direction: column;
+ width: 100px;
+ height: 10px;
+ }
+
+ #test-flex-item-overlapping-green {
+ color: green;
+ background-color: green;
+ font: 50px/1 Ahem;
+ }
+
+ #content-100x100 {
+ width: 100px;
+ height: 100px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <div id="test-flex-item-overlapping-green">
+ <div id="content-100x100"></div>
+ </div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Flexible Box Test: Minimum height of flex items</title>
+ <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Checks that minimum height for flex items is the min-content size (which corresponds to the image size)." />
+ <style type="text/css"><![CDATA[
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ flex-direction: column;
+ width: 100px;
+ height: 10px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img src="../support/100x100-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Flexible Box Test: Minimum height of flex items</title>
+ <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Checks that minimum height for flex items is the specified size, as the min-content size of the image corresponds to that." />
+ <style type="text/css"><![CDATA[
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ flex-direction: column;
+ width: 100px;
+ height: 10px;
+ }
+
+ #test-flex-item-overlapping-green {
+ height: 100px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img id="test-flex-item-overlapping-green" src="../support/200x200-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Flexible Box Test: Minimum width of flex items</title>
+ <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Checks that minimum width for flex items is the specified size if it's smaller than the min-content size." />
+ <style type="text/css"><![CDATA[
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ width: 10px;
+ }
+
+ #test-flex-item-overlapping-green {
+ background-color: green;
+ width: 100px;
+ }
+
+ #content-200x100 {
+ width: 200px;
+ height: 100px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <div id="test-flex-item-overlapping-green">
+ <div id="content-200x100"></div>
+ </div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Flexible Box Test: Minimum width of flex items</title>
+ <link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#min-size-auto" title="4.5. Implied Minimum Size of Flex Items" />
+ <link rel="match" href="reference/ref-filled-green-100px-square.xht" />
+ <meta name="assert" content="Checks that minimum width for flex items is the min-content size (which corresponds to the image size)." />
+ <style type="text/css"><![CDATA[
+ #reference-overlapped-red {
+ position: absolute;
+ background-color: red;
+ width: 100px;
+ height: 100px;
+ z-index: -1;
+ }
+
+ #constrained-flex {
+ display: flex;
+ width: 10px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+
+ <div id="reference-overlapped-red"></div>
+ <div id="constrained-flex">
+ <img src="../support/100x100-green.png" />
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+
+<html>
+<head>
+ <title>CSS Reftest Reference: flex order</title>
+ <link rel="author" title="Mitsuteru Sawa" href="mailto:mitsuteru.s@gmail.com">
+ <style>
+ #container { display: flex; }
+ #highOrdinal {
+ background: lime;
+ height: 100px; width: 100px;
+ }
+ #middleOrdinal {
+ background: orange;
+ height: 100px; width: 100px;
+ }
+ #lowOrdinal {
+ background: red;
+ height: 100px; width: 100px;
+ }
+ </style>
+</head>
+<body>
+ <div id="container">
+ <div id="highOrdinal"></div>
+ <div id="middleOrdinal"></div>
+ <div id="lowOrdinal"></div>
+ </div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Test: flex order</title>
+ <link rel="author" title="Mitsuteru Sawa" href="mailto:mitsuteru.s@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#order-property">
+ <link rel="match" href="flex-order-ref.html">
+ <meta name="assert" content="ordered flex items should ordered properly">
+ <style>
+ #container {
+ display: flex;
+ }
+ #lowOrdinal {
+ order: 3;
+ background: red;
+ height: 100px; width: 100px;
+ }
+ #highOrdinal {
+ order: 1;
+ background: lime;
+ height: 100px; width: 100px;
+ }
+ #middleOrdinal {
+ order: 2;
+ background: orange;
+ height: 100px; width: 100px;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if the flex items are ordered as lime-orange-red.</p>
+ <div id="container">
+ <div id="highOrdinal"></div>
+ <div id="lowOrdinal"></div>
+ <div id="middleOrdinal"></div>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\r
+<html xmlns="http://www.w3.org/1999/xhtml">\r
+ <head>\r
+ <title>CSS Test: A flex container with 'flex-flow' set to 'row wrap'</title>\r
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />\r
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap" />\r
+ <meta name="flags" content=""/>\r
+ <meta name="assert" content="This test checks that the flex container with 'flex-flow: row wrap' is multi-line flex container." />\r
+ <style type="text/css">\r
+ #parent\r
+ {\r
+ position: relative;\r
+ }\r
+ div div\r
+ {\r
+ display: flex;\r
+ flex-flow: row wrap;\r
+ height: 100px;\r
+ width: 350px;\r
+ }\r
+ div p\r
+ {\r
+ background-color: red;\r
+ margin: 0;\r
+ z-index: -1;\r
+ }\r
+ span\r
+ {\r
+ background-color: green;\r
+ position: absolute;\r
+ }\r
+ span, div p\r
+ {\r
+ height: 50px;\r
+ }\r
+ #ref1\r
+ {\r
+ width: 300px;\r
+ }\r
+ #ref2\r
+ {\r
+ top: 50px;\r
+ }\r
+ #ref2, div p\r
+ {\r
+ width: 150px;\r
+ }\r
+ </style>\r
+ </head>\r
+ <body>\r
+ <p>Test passes if there is no red visible on the page.</p>\r
+ <div id="parent">\r
+ <span id="ref1"></span>\r
+ <span id="ref2"></span>\r
+ <div>\r
+ <p></p>\r
+ <p></p>\r
+ <p></p>\r
+ </div>\r
+ </div>\r
+ </body>\r
+</html>\r
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - number(positive)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property set positive number determines how much the flex item will shrink relative to the rest of the flex items in the flex container when negative free space is distributed">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 100px;
+ }
+ #test1 {
+ flex-shrink: 2;
+ }
+ #test2 {
+ background-color: green;
+ flex-shrink: 3;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 60px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - number(negative)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property set negative is invalid to shrink flex items when negative free space is distributed">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 100px;
+ }
+ #test1 {
+ flex-shrink: -2;
+ }
+ #test2 {
+ background-color: green;
+ flex-shrink: -3;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - 1(initial value)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property initial value is 1">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 100px;
+ }
+ #test2 {
+ background-color: green;
+ flex-shrink: 4;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 80px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - number(flex container has enough space)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property is invalid when flex container has enough space to load flex items">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ background-color: green;
+ height: 100px;
+ width: 40px;
+ }
+ #test1 {
+ flex-shrink: 2;
+ }
+ #test2 {
+ flex-shrink: 3;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-left: 80px;
+ margin-top: -100px;
+ width: 20px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - 0</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property set 0 will ignore the flex container">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 50px;
+ }
+ #container div {
+ height: 100px;
+ width: 50px;
+ }
+ #test1 {
+ flex-shrink: 0;
+ }
+ #test2 {
+ background-color: green;
+ flex-shrink: 0;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - 0(one of flex-shrinks sets 0, another not)</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex item whose flex-shrink property of set 0 will displayed on the top of all flex items">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 100px;
+ }
+ #test1 {
+ background-color: green;
+ flex-shrink: 0;
+ }
+ #test2 {
+ background-color: yellow;
+ flex-shrink: 0.1;
+ }
+ #test3 {
+ background-color: blue;
+ flex-shrink: 2;
+ }
+ #test2 {
+ background-color: black;
+ flex-shrink: 3;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ <div id="test3"></div>
+ <div id="test4"></div>
+ </div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Flexbox Test: flex-shrink - applied to flex container</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="author" title="Shiyou Tan" href="mailto:shiyoux.tan@intel.com">
+<link rel="help" title="7.3.2. The 'flex-shrink' property" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-shrink">
+<link rel="match" href="reference/ref-filled-green-100px-square.xht">
+<meta name="flags" content="">
+<meta name="assert" content="The flex-shrink property applied to flex container is invalid, all flex items will use the default value 1">
+<style>
+ #container {
+ background-color: red;
+ display: flex;
+ flex-shrink: 2;
+ height: 100px;
+ width: 100px;
+ }
+ #container div {
+ height: 100px;
+ width: 100px;
+ }
+ #test2 {
+ background-color: green;
+ }
+ #cover {
+ background-color: green;
+ height: 100px;
+ margin-top: -100px;
+ width: 50px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div id="container">
+ <div id="test1"></div>
+ <div id="test2"></div>
+ </div>
+ <div id="cover"></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Test: 'display' property set to 'flex'</title>
+ <link rel="author" title="Hua Zhao" href="mailto:zhaohua.design@163.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-property">
+ <link rel="match" href="reference/flex-vertical-align-effect.html">
+ <meta name="flags" content="" />
+ <meta name="assert" content="vertical-align property has no effect" />
+
+ <style type="text/css">
+ #container {
+ display:flex;
+ }
+ input{
+ margin:0;padding:0;vertical-align:middle;
+ }
+ </style>
+</head>
+<body>
+
+ <p>Test passes if the radio does not vertical align to the middle of the text box.</p>
+ <div id="container">
+ <input type="text" value="input1" />
+ <input type="radio" />
+
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with 'flex-flow' set to 'wrap'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap" />
+ <meta name="flags" content="">
+ <meta name="assert" content="This test checks that the flex container with 'flex-flow: wrap' is a multi-line flex container." />
+ <style type="text/css">
+ #flexbox
+ {
+ background-color: red;
+ display: flex;
+ flex-flow: wrap;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ width: 150px;
+ }
+ .blue
+ {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div class="blue"></div>
+ <div></div>
+ <div class="blue"></div>
+ <div></div>
+ </div>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-wrap_nowrap</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-wrap value nowrap." />
+ <style>
+ #test{
+ width: 120px;
+ display: flex;
+ flex-wrap: wrap;
+ flex-wrap: nowrap;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row and no gap between them.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-wrap_wrap-reverse</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the flex-wrap value wrap-reverse." />
+ <style>
+ #test{
+ width: 120px;
+ display: flex;
+ flex-wrap: wrap-reverse;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in two rows in a red rectangle and no gap between them.<br>
+ 2. the rectangle 3 appear in the first line of rows.<br>
+ 3. the rectangles appear in upper left of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: flex-wrap_wrap</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the display can recognize inline-flex value." />
+ <style>
+ div#test{
+ width: 120px;
+ display: flex;
+ flex-wrap: wrap;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in two rows in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1 and 2 appear in the first line of rows.<br>
+ 3. the rectangles appear in upper left of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-direction = column-reverse</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, and main-start and main-end are swapped, when flex-direction = column-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: column-reverse;
+ -webkit-flex-direction: column-reverse;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>7</div><div>4</div><div>1</div>
+ <div>8</div><div>5</div><div>2</div>
+ <div>9</div><div>6</div><div>3</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-direction = column</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, when flex-direction = column. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: column;
+ -webkit-flex-direction: column;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>1</div><div>4</div><div>7</div>
+ <div>2</div><div>5</div><div>8</div>
+ <div>3</div><div>6</div><div>9</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-direction = row by default</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode by default. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>1</div><div>2</div><div>3</div>
+ <div>4</div><div>5</div><div>6</div>
+ <div>7</div><div>8</div><div>9</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-direction = row-reverse</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex container's main axis has the opposite orientation as the inline axis of the current writing mode, when flex-direction = row-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: row-reverse;
+ -webkit-flex-direction: row-reverse;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>3</div><div>2</div><div>1</div>
+ <div>6</div><div>5</div><div>4</div>
+ <div>9</div><div>8</div><div>7</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-direction = row</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode, when flex-direction = row. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: row;
+ -webkit-flex-direction: row;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>1</div><div>2</div><div>3</div>
+ <div>4</div><div>5</div><div>6</div>
+ <div>7</div><div>8</div><div>9</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<!--
+Copyright (c) 2015 Samsung Electronics Co., Ltd.
+
+Licensed under the Apache License, Version 2.0 (the License);
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+Author:
+ jun1 gao <jun1.gao@samsung.com>
+
+-->
+<html>
+ <head>
+ <title>CSS Flexbox Test: flexbox-flex-layout</title>
+ <link rel="author" title="Jun Gao" href="mailto:jun1.gao@samsung.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#align-items-property">
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that align-items and justify-content properties by default. This assumes align-items = 'center', and justify-content = 'center'.">
+ <style>
+ .Aligner-item--fixed{
+ -webkit-box-flex:0;
+ -webkit-flex:none;
+ -ms-flex:none;
+ flex:none;
+ max-width:50%
+ }
+ .Demo{
+ width:100%;
+ background:rgba(147,128,108,.1);
+ border-radius:3px
+ }
+ .Demo--spaced{
+ margin-bottom:1.5em
+ }
+ .Aligner {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ .Aligner-item {
+ max-width: 50%;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if "I'm Centered" should be appear both vertically and horizontally centered.</p>
+ <div class="Demo Demo--spaced">
+ <div class=Aligner>
+ <div class="Aligner-item Aligner-item--fixed">
+ <div class=Demo>
+ <h3>I'm Centered!</h3>
+ <p contenteditable=true>This box is both vertically and horizontally centered.</p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-wrap defaults to nowrap</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="match" href="reference/flexbox-flex-wrap-nowrap-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex elements default to flex-wrap: nowrap if flex-wrap is not set. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none.">
+ <style>
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+
+ background: green;
+ border-right: 60px solid red;
+
+ width: 60px;
+ height: 120px;
+ }
+
+ .flex-wrapper div{
+ width: 60px;
+ flex: none;
+ -webkit-flex: none;
+ }
+
+ .green {
+ background: green;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a green square and no red.</p>
+ <div class="flex-wrapper">
+ <div></div>
+ <div class="green"></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!doctype html>
+<html>
+<head>
+ <title>CSS Flexbox Test: flex-wrap flexes widths after line breaking</title>
+ <link rel="author" title="Alan Stearns" href="mailto:stearns@adobe.com">
+ <style>
+ .container {
+ width: 150px;
+ height: 100px;
+ background: green;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if there is a green rectangle and no red.</p>
+ <div class="container"></div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!doctype html>
+<html>
+<head>
+ <title>CSS Flexbox Test: flex-wrap flexes widths after line breaking</title>
+ <link rel="author" title="Alan Stearns" href="mailto:stearns@adobe.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-lines">
+ <meta name="flags" content="">
+ <link rel="match" href="flexbox-flex-wrap-flexing-ref.html"/>
+ <meta name="assert" content="Flex items given more space after line breaking should flex wider">
+ <meta name="assert" content="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+ <meta name="assert" content="http://www.w3.org/TR/css-flexbox-1/#flex-property">
+ <style>
+ .container {
+ display: flex;
+ width: 150px;
+ height: 100px;
+ flex-wrap: wrap;
+ background: red;
+ }
+ .item {
+ min-width: 100px;
+ flex: 1;
+ height: 50px;
+ display: inline-block; /*to fail the test if display:flex fails*/;
+ background: green;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if there is a green rectangle and no red.</p>
+ <div class="container">
+ <div class="item"></div>
+ <div class="item"></div>
+ </div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-wrap = nowrap</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="match" href="reference/flexbox-flex-wrap-nowrap-ref.html" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex elements set to flex-wrap: nowrap will not wrap their flex items. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none.">
+ <style>
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-wrap: nowrap;
+ -webkit-flex-wrap: nowrap;
+
+ background: green;
+ border-right: 60px solid red;
+
+ width: 60px;
+ height: 120px;
+ }
+
+ .flex-wrapper div{
+ width: 60px;
+ flex: none;
+ -webkit-flex: none;
+ }
+
+ .green {
+ background: green;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a green square and no red.</p>
+ <div class="flex-wrapper">
+ <div></div>
+ <div class="green"></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-wrap = wrap-reverse</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex elements wrap left-to-right and bottom-to-top within their flex container when flex-wrap = 'wrap-reverse'. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-wrap: wrap-reverse;
+ -webkit-flex-wrap: wrap-reverse;
+
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>7</div><div>8</div><div>9</div>
+ <div>4</div><div>5</div><div>6</div>
+ <div>1</div><div>2</div><div>3</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexbox Test: Flex-wrap = wrap</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="match" href="reference/flexbox-flex-direction-ref.htm" />
+ <meta name="flags" content="">
+ <meta name="assert" content="Test checks that flex elements wrap left-to-right within their flex container when flex-wrap = 'wrap', matching the writing direction. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <style>
+
+ /* Test specific Styles */
+
+ .flex-wrapper {
+ display: flex;
+ display: -webkit-flex;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ }
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ -webkit-writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>1</div><div>2</div><div>3</div>
+ <div>4</div><div>5</div><div>6</div>
+ <div>7</div><div>8</div><div>9</div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container layout starts with lowest order item</title>
+ <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com">
+ <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test check that a flex container layous out its content starting with the lowest numbered ordinal group and going up">
+ <style>
+ #test {
+ display: flex;
+ }
+
+ #leftmost {
+ order: -1;
+ }
+
+ #middle {
+ order:0;
+ }
+
+ #rightmost {
+ order:1;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First,Second,Third'.</p>
+ <div id="test">
+ <p id="rightmost">Third</p>
+ <p id="middle">Second,</p>
+ <p id="leftmost">First,</p>
+ </div>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: order only affects flex items</title>
+ <link rel="author" title="Sylvain Galineau" href="mailto:galineau@adobe.com">
+ <link rel="reviewer" title="Arron Eicholz" href="mailto:arronei@microsoft.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order">
+ <meta name="flags" content="">
+ <meta name="assert" content="This test check that the order property has no effect on elements that are not flex items">
+ <style>
+ #test {
+ display: block; /* Not a flex container */
+ }
+
+ #leftmost {
+ order: 2;
+ }
+
+ #middle {
+ order:1;
+ }
+
+ #rightmost {
+ order:0;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First, Second, Third'.</p>
+ <div id="test">
+ <span id="leftmost">First,</span>
+ <span id="middle">Second,</span>
+ <span id="rightmost">Third</span>
+ </div>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: Test flex:auto - no flex:auto set for 1 item in line 1, and another item in line 2</title>
+ <link rel="author" title="Bora Vuth" href="mailto:vbora85@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-common">
+ <meta name="assert" content="Test passes if box1 and box3 are 100px width; and box3 width's X axis doesn't end with the same one of box2's">
+ <style type="text/css">
+ #flexContainer {
+ background: blue;
+ margin: 10px 0;
+ border: 1px solid black;
+ height: 200px;
+ width: 300px;
+
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ }
+ .item{
+ flex:auto;
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ .item1{
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if box1 and box3 are 100px width; and box3 width's X axis doesn't end with the same one of box2's</p></br>
+ <div id="flexContainer">
+ <div class="item1">box1</div>
+ <div class="item">box2</div>
+ <div class="item1">box3</div>
+ </div>
+</body>
+</html>
+
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: flex:auto - one item in line 1 doesn't have that flex:auto set</title>
+ <link rel="author" title="Bora Vuth" href="mailto:vbora85@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-common">
+ <meta name="assert" content="Test passes if box1's width is 100px (smaller than box2's width)">
+ <style type="text/css">
+ #flexContainer {
+ background: blue;
+ margin: 10px 0;
+ border: 1px solid black;
+ height: 200px;
+ width: 300px;
+
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ }
+ .item{
+ flex:auto;
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ .item1{
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if box1's width is 100px (smaller than box2's width)</p></br>
+ <div id="flexContainer">
+ <div class="item1">box1</div>
+ <div class="item">box2</div>
+ <div class="item">box3</div>
+ </div>
+</body>
+</html>
+
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: Test flex:auto - no flex:auto set for item on 2nd line</title>
+ <link rel="author" title="Bora Vuth" href="mailto:vbora85@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-common">
+ <meta name="assert" content="Test passes if box3's width is 100px (smaller than box1's width), and it starts at the same X axis as box1">
+ <style type="text/css">
+ #flexContainer {
+ background: blue;
+ margin: 10px 0;
+ border: 1px solid black;
+ height: 200px;
+ width: 300px;
+
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ }
+ .item{
+ flex:auto;
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ .item1{
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if box3's width is 100px (smaller than box1's width), and it starts at the same X axis as box1</p></br>
+ <div id="flexContainer">
+ <div class="item">box1</div>
+ <div class="item">box2</div>
+ <div class="item1">box3</div>
+ </div>
+</body>
+</html>
+
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: flex:auto - applying to all items</title>
+ <link rel="author" title="Bora Vuth" href="mailto:vbora85@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-common">
+ <meta name="assert" content="Test passes if all boxes are not 100px width; and box3 start position is the same X axis as box1's and end position is the same as box2">
+ <style type="text/css">
+ #flexContainer {
+ background: blue;
+ margin: 10px 0;
+ border: 1px solid black;
+ height: 200px;
+ width: 300px;
+
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ }
+ .item{
+ flex: auto;
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if all boxes are not 100px width; and box3 start position is the same X axis as box1's and end position is the same as box2</p>
+ <div id="flexContainer">
+ <div class="item">box1</div>
+ <div class="item">box2</div>
+ <div class="item">box3</div>
+ </div>
+</body>
+</html>
+
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexbox Test: flex:auto - applying to all items</title>
+ <link rel="author" title="Bora Vuth" href="mailto:vbora85@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-common">
+ <meta name="assert" content="Test passes if all boxes are not 100px width; and box3 start position is the same X axis as box1's and end position is the same as box2">
+ <style type="text/css">
+ #flexContainer {
+ background: blue;
+ margin: 10px 0;
+ border: 1px solid black;
+ height: 200px;
+ width: 300px;
+
+ display: flex;
+ flex-wrap: wrap;
+ }
+ .item{
+ flex: auto;
+ background: white;
+ margin: 0 20px 10px 10px;
+ width: 100px;
+ height: 40px;
+ display: inline-block;
+ }
+ .order0{
+ order: 0;
+ }
+ .order1{
+ order: 100;
+ }
+ .order2{
+ order: 2;
+ }
+ </style>
+</head>
+<body>
+ <p>Test passes if all boxes are not 100px width; and box3 start position is the same X axis as box1's and end position is the same as box2</p>
+ <div id="flexContainer">
+ <div class="item order1">box3</div>
+ <div class="item order2">box2</div>
+ <div class="item order0">box1</div>
+ </div>
+</body>
+</html>
+
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>flexible box flex item float effect</title>
+ <link rel="author" title="zhouli" href="mailto:liz@oupeng.com">
+ <link rel="author" title="Qunfang Lin" href="qunfang.lin@samsung.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers" />
+ <link rel="match" href="reference/flex-box-float-ref.html">
+ <meta name="assert" content="float has no effect on flex items" />
+ <style>
+ #myDiv {
+ display: flex;
+ flex-flow: row wrap;
+ align-content: space-between;
+ position: relative;
+ }
+ #myDiv p{
+ width: 50px;
+ height: 50px;
+ margin: 0;
+ }
+ #first-p{
+ background-color: green;
+ float: right;
+ }
+ #second-p{
+ background-color: blue;
+ }
+ #myDiv #fail-flag{
+ width: 100px;
+ background-color: red;
+ position: absolute;
+ left: 0;
+ top: 0;
+ z-index: -1;
+ }
+ </style>
+</head>
+<body>
+ <p>'float' have no effect on a flex item.</p>
+ <p>The test passes if there is a green square, a blue square and no red square.</p>
+<div id="myDiv">
+ <p id="first-p"> </p><p id="second-p"> </p><p id="fail-flag"> </p>
+</div>
+<script>
+</script>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with 'justify-content' property set to 'center'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="image">
+ <meta name="assert" content="This test checks that the flex container with 'justify-content: center' centers flex items in the main axis of each line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to right, blue 0, blue 75px, red 75px, red 225px, orange 225px, orange 300px);
+ display: flex;
+ justify-content: center;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ width: 76px;
+ }
+ .blue
+ {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div class="blue"></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'justify-content' property set to 'flex-start'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="image">
+ <meta name="assert" content="This test checks that the flex container with 'justify-content: flex-start' packs flex items toward the start of the main axis of each line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to right, red 0, red 150px, orange 150px, orange 300px);
+ display: flex;
+ justify-content: center;
+ justify-content: flex-start;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: blue;
+ width: 75px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'justify-content' property set to 'flex-end'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="image">
+ <meta name="assert" content="This test checks that the flex container with 'justify-content: flex-end' packs flex items toward the end of the main axis of each line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to right, blue 0, blue 150px, red 150px, red 300px);
+ display: flex;
+ justify-content: flex-end;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ width: 75px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'justify-content' property set to 'space-between'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="image">
+ <meta name="assert" content="This test checks that the flex container with 'justify-content: space-between' evenly distributes flex items in the main axis of each line." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to right, red 0, red 75px, blue 75px, blue 150px, orange 150px, orange 225px, red 225px, red 300px);
+ display: flex;
+ justify-content: space-between;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ width: 76px;
+ }
+ #blue
+ {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="blue"></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Test: A flex container with the 'justify-content' property set to 'space-around'</title>
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <link rel="match" href="reference/justify-content-001-ref.html">
+ <meta name="flags" content="image">
+ <meta name="assert" content="This test checks that the flex container with 'justify-content: space-around' evenly distributes flex items in the main axis of each line, with half-size spaces on either end." />
+ <style type="text/css">
+ #flexbox
+ {
+ background: linear-gradient(to right, blue 0, blue 38px, red 38px, red 112px, blue 112px, blue 150px, orange 150px, orange 188px, red 188px, red 262px, orange 262px, orange 300px);
+ display: flex;
+ justify-content: space-around;
+ height: 100px;
+ width: 300px;
+ }
+ div div
+ {
+ background-color: orange;
+ width: 76px;
+ }
+ #blue
+ {
+ background-color: blue;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="flexbox">
+ <div id="blue"></div>
+ <div></div>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: justify-content_center</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can identify the justify-content value center." />
+ <style>
+ #test01, #test02, #test03{
+ text-align:center;
+ font-size: 20px;
+ width: 30px;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
+ #test{
+ background: #ff0000;
+ height: 200px;
+ width: 200px;
+ display: flex;
+ justify-content: center;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in middle of red rectangle.<br>
+ 3. equal amounts of empty space between the left edge of the red rectangle and ractangle 1 and between the right edge of the red rectangle and rectangle 3.<br>
+ 4. the height of the 1, 2, 3 is the same as the height of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: justify-content_flex-end</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can indentify the justify-content value flex-end." />
+ <style>
+ #test01, #test02, #test03{
+ text-align:center;
+ font-size: 20px;
+ width: 30px;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
+ #test{
+ background: #ff0000;
+ height: 200px;
+ width: 200px;
+ display: flex;
+ justify-content: flex-end;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in right of red rectangle.<br>
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: justify-content_flex-start</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can indentify the justify-content value flex-start." />
+ <style>
+ #test01, #test02, #test03{
+ text-align:center;
+ font-size: 20px;
+ width: 30px;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
+ #test{
+ background: #ff0000;
+ height: 200px;
+ width: 200px;
+ display: flex;
+ justify-content: flex-start;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle and no gap between them.<br>
+ 2. the rectangle 1, 2, 3 appear in left of red rectangle.<br>
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: justify-content_space-around</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can indentify the justy-content value space-around." />
+ <style>
+ #test01, #test02, #test03{
+ text-align:center;
+ font-size: 20px;
+ width: 30px;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
+ #test{
+ background: #ff0000;
+ height: 200px;
+ width: 200px;
+ display: flex;
+ justify-content: space-around;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle.<br>
+ 2. the rectangle 1, 2, 3 are distributed such that the empty space between any two adjacent rectangle is the same, and the empty space of the row before the first and after the last rectangle are half the size of the other empty spaces.<br>
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: justify-content_space-between</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-justify-content" />
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can indentify the justify-content value space-between." />
+ <style>
+ #test01, #test02, #test03{
+ text-align:center;
+ font-size: 20px;
+ width: 30px;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
+ #test{
+ background: #ff0000;
+ height: 200px;
+ width: 200px;
+ display: flex;
+ justify-content: space-between;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if:<br>
+ 1. the rectangle 1, 2, 3 show up in a row in a red rectangle.<br>
+ 2. No gap between the left edge of red rectangle and the left of rectangle 1, no gap between the right edge of red rectangle and the right of rectangle 3 too, and rectangle 2 is distributed so that the empty space between rectangle 1 and rectangle 3 is the same.<br>
+ 3. the height of the 1, 2, 3 is the same as the height of the red rectangle.</p>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container multiline wrapping-reverse in column-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ .test {
+ width: 300px;
+ float: left;
+ width: 33.3%;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ height: 90px;
+ }
+
+ #row1-col2 {
+ height: 90px;
+ }
+
+ #row1-col3 {
+ height: 90px;
+ }
+
+ #row2-col1 {
+ height: 140px;
+ }
+
+ #row2-col2 {
+ height: 140px;
+ }
+
+ #row3-col1 {
+ height: 290px;
+ }
+
+ .clear {
+ clear: both;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div class="test">
+ <p id="row1-col1">1-1</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col3">1-3</p>
+ </div>
+ <div class="test">
+ <p id="row2-col1">2-1</p>
+ <p id="row2-col2">2-2</p>
+ </div>
+ <div class="test">
+ <p id="row3-col1">3-1</p>
+ </div>
+ <div class="clear"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container multiline wrapping-reverse in column-reverse direction.</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="multi-line-wrap-reverse-column-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container reverse-wraps blocks multiline in column-reverse direction.">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ #test {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: column-reverse;
+ -webkit-flex-direction: column-reverse;
+ flex-wrap: wrap-reverse;
+ -webkit-flex-wrap: wrap-reverse;
+ height: 300px;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #col1-row1 {
+ height: 90px;
+ }
+
+ #col1-row2 {
+ height: 90px;
+ }
+
+ #col1-row3 {
+ height: 90px;
+ }
+
+ #col2-row1 {
+ height: 140px;
+ }
+
+ #col2-row2 {
+ height: 140px;
+ }
+
+ #col3-row1 {
+ height: 290px;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div id="test">
+ <p id="col3-row1">3-1</p>
+ <p id="col2-row2">2-2</p>
+ <p id="col2-row1">2-1</p>
+ <p id="col1-row3">1-3</p>
+ <p id="col1-row2">1-2</p>
+ <p id="col1-row1">1-1</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container multiline wrapping-reverse in row-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ .test {
+ width: 300px;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ width: 90px;
+ float: left;
+ }
+
+ #row1-col2 {
+ width: 90px;
+ float: left;
+ }
+
+ #row1-col3 {
+ width: 90px;
+ float: left;
+ }
+
+ #row2-col1 {
+ width: 140px;
+ float: left;
+ }
+
+ #row2-col2 {
+ width: 140px;
+ float: left;
+ }
+
+ #row3-col1 {
+ width: 290px;
+ float: left;
+ }
+
+ .clear {
+ clear: both;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div class="test">
+ <p id="row1-col1">1-1</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col3">1-3</p>
+ </div>
+ <div class="clear"></div>
+ <div class="test">
+ <p id="row2-col1">2-1</p>
+ <p id="row2-col2">2-2</p>
+ </div>
+ <div class="clear"></div>
+ <div class="test">
+ <p id="row3-col1">3-1</p>
+ </div>
+ <div class="clear"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container multiline wrapping-reverse in row-reverse direction.</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="multi-line-wrap-reverse-row-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container reverse-wraps blocks multiline in row-reverse direction.">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ #test {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: row-reverse;
+ -webkit-flex-direction: row-reverse;
+ flex-wrap: wrap-reverse;
+ -webkit-flex-wrap: wrap-reverse;
+ width: 300px;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ width: 90px;
+ }
+
+ #row1-col2 {
+ width: 90px;
+ }
+
+ #row1-col3 {
+ width: 90px;
+ }
+
+ #row2-col1 {
+ width: 140px;
+ }
+
+ #row2-col2 {
+ width: 140px;
+ }
+
+ #row3-col1 {
+ width: 290px;
+ }
+
+
+ </style>
+ </head>
+ <body>
+ <div id="test">
+ <p id="row3-col1">3-1</p>
+ <p id="row2-col2">2-2</p>
+ <p id="row2-col1">2-1</p>
+ <p id="row1-col3">1-3</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col1">1-1</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container multiline wrapping in column-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ .test {
+ width: 300px;
+ float: left;
+ width: 33.3%;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ height: 90px;
+ }
+
+ #row1-col2 {
+ height: 90px;
+ }
+
+ #row1-col3 {
+ height: 90px;
+ }
+
+ #row2-col1 {
+ height: 140px;
+ }
+
+ #row2-col2 {
+ height: 140px;
+ }
+
+ #row3-col1 {
+ height: 290px;
+ }
+
+ .clear {
+ clear: both;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div class="test">
+ <p id="row1-col1">1-1</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col3">1-3</p>
+ </div>
+ <div class="test">
+ <p id="row2-col1">2-1</p>
+ <p id="row2-col2">2-2</p>
+ </div>
+ <div class="test">
+ <p id="row3-col1">3-1</p>
+ </div>
+ <div class="clear"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container multiline wrapping in column-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="multi-line-wrap-with-column-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container wraps blocks multiline in column-reverse direction.">
+ <style>
+ * { margin:0; padding:0; font-size:100%; line-height:1; }
+
+ #test {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: column-reverse;
+ -webkit-flex-direction: column-reverse;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ height: 300px;
+ }
+
+ p {
+ margin-top: 10px;
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #col1-row1 {
+ height: 90px;
+ }
+
+ #col1-row2 {
+ height: 90px;
+ }
+
+ #col1-row3 {
+ height: 90px;
+ }
+
+ #col2-row1 {
+ height: 140px;
+ }
+
+ #col2-row2 {
+ height: 140px;
+ }
+
+ #col3-row1 {
+ height: 290px;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div id="test">
+ <p id="col1-row3">1-3</p>
+ <p id="col1-row2">1-2</p>
+ <p id="col1-row1">1-1</p>
+ <p id="col2-row2">2-2</p>
+ <p id="col2-row1">2-1</p>
+ <p id="col3-row1">3-1</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container multiline wrapping in row-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <style>
+ .test {
+ width: 300px;
+ }
+
+ p {
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ width: 90px;
+ float: left;
+ }
+
+ #row1-col2 {
+ width: 90px;
+ float: left;
+ }
+
+ #row1-col3 {
+ width: 90px;
+ float: left;
+ }
+
+ #row2-col1 {
+ width: 140px;
+ float: left;
+ }
+
+ #row2-col2 {
+ width: 140px;
+ float: left;
+ }
+
+ #row3-col1 {
+ width: 290px;
+ float: left;
+ }
+
+ .clear {
+ clear: both;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div class="test">
+ <p id="row1-col1">1-1</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col3">1-3</p>
+ </div>
+ <div class="clear"></div>
+ <div class="test">
+ <p id="row2-col1">2-1</p>
+ <p id="row2-col2">2-2</p>
+ </div>
+ <div class="clear"></div>
+ <div class="test">
+ <p id="row3-col1">3-1</p>
+ </div>
+ <div class="clear"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container multiline wrapping in row-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-wrap-property">
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#flex-direction-property">
+ <link rel="match" href="multi-line-wrap-with-row-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container wraps blocks multiline in row-reverse direction.">
+ <style>
+ #test {
+ display: flex;
+ display: -webkit-flex;
+ flex-direction: row-reverse;
+ -webkit-flex-direction: row-reverse;
+ flex-wrap: wrap;
+ -webkit-flex-wrap: wrap;
+ width: 300px;
+ }
+
+ p {
+ margin-right: 10px;
+ background: #ccc;
+ }
+
+ #row1-col1 {
+ width: 90px;
+ }
+
+ #row1-col2 {
+ width: 90px;
+ }
+
+ #row1-col3 {
+ width: 90px;
+ }
+
+ #row2-col1 {
+ width: 140px;
+ }
+
+ #row2-col2 {
+ width: 140px;
+ }
+
+ #row3-col1 {
+ width: 290px;
+ }
+
+ </style>
+ </head>
+ <body>
+ <div id="test">
+ <p id="row1-col3">1-3</p>
+ <p id="row1-col2">1-2</p>
+ <p id="row1-col1">1-1</p>
+ <p id="row2-col2">2-2</p>
+ <p id="row2-col1">2-1</p>
+ <p id="row3-col1">3-1</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD//XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">\r
+<html xmlns="http://www.w3.org/1999/xhtml">\r
+ <head>\r
+ <title>CSS Test: The 'order' property on flex items set to a value of '-1'</title>\r
+ <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />\r
+ <link rel="help" href="http://www.w3.org/TR/css3-flexbox/#order" />\r
+ <meta name="flags" content=""/>\r
+ <meta name="assert" content="This test checks that a flex container will lay out its content in the order specified by the ordinal groups." />\r
+ <style type="text/css">\r
+ #parent\r
+ {\r
+ position: relative;\r
+ }\r
+ div div\r
+ {\r
+ display: flex;\r
+ flex-flow: row;\r
+ }\r
+ div p\r
+ {\r
+ margin: 0;\r
+ }\r
+ span, div p\r
+ {\r
+ height: 50px;\r
+ width: 75px;\r
+ }\r
+ #flexItem1\r
+ {\r
+ order: 0;\r
+ }\r
+ #flexItem2\r
+ {\r
+ background-color: red;\r
+ order: -1;\r
+ }\r
+ span\r
+ {\r
+ position: absolute;\r
+ }\r
+ span, #flexItem1\r
+ {\r
+ background-color: green;\r
+ }\r
+ </style>\r
+ </head>\r
+ <body>\r
+ <p>Test passes if there is no red visible on the page.</p>\r
+ <div id="parent">\r
+ <span></span>\r
+ <div>\r
+ <p id="flexItem1"></p>\r
+ <p id="flexItem2"></p>\r
+ </div>\r
+ </div>\r
+ </body>\r
+</html>\r
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container layout lowest order with column-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <style>
+ p {
+ margin: 0;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First,Second,Third' from top.</p>
+ <div id="test">
+ <p id="first">First,</p>
+ <p id="second">Second,</p>
+ <p id="third">Third</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container layout lowest order with column-reverse direction</title>
+ <link rel="author" title="tmtysk" href="mailto:tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins" href="mailto:jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order">
+ <link rel="match" href="order-with-column-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container layouts out its content starting with the lowest numbered ordinal group and going up with column-reverse direction.">
+ <style>
+ #test {
+ display: flex;
+ flex-direction: column-reverse;
+ }
+
+ #first {
+ order: 3;
+ }
+
+ #second {
+ order: 2;
+ }
+
+ #third {
+ order: 1;
+ }
+ p {
+ margin: 0;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First,Second,Third' from top.</p>
+ <div id="test">
+ <p id="second">Second,</p>
+ <p id="first">First,</p>
+ <p id="third">Third</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test Reference: flex container layout lowest order with row-reverse direction</title>
+ <link rel="author" title="tmtysk" href="tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins, Jr." href="jackalmage@gmail.com">
+ <style>
+ #leftmost {
+ float: right;
+ }
+
+ #middle {
+ float: right;
+ }
+
+ #rightmost {
+ float: right;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First,Second,Third' from leftmost.</p>
+ <div id="test">
+ <p id="rightmost">Third</p>
+ <p id="middle">Second,</p>
+ <p id="leftmost">First,</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Test: flex container layout lowest order with row-reverse direction</title>
+ <link rel="author" title="tmtysk" href="tmtysk@gmail.com">
+ <link rel="reviewer" title="Tab Atkins, Jr." href="jackalmage@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order">
+ <meta name="flags" content="">
+ <link rel="match" href="order-with-row-reverse-ref.html">
+ <meta name="assert" content="This test check that a flex container layouts out its content starting with the lowest numbered ordinal group and going up with row-reverse direction.">
+ <style>
+ #test {
+ display: flex;
+ flex-direction: row-reverse;
+ }
+
+ #leftmost {
+ order: 1;
+ }
+
+ #middle {
+ order: 0;
+ }
+
+ #rightmost {
+ order: -1;
+ }
+ </style>
+ </head>
+ <body>
+ <p>Test passes if the paragraph below reads 'First,Second,Third' from the leftmost of the sentence.</p>
+ <div id="test">
+ <p id="leftmost">First,</p>
+ <p id="middle">Second,</p>
+ <p id="rightmost">Third</p>
+ </div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flexible Box Test: order_check</title>
+ <link rel="author" title="Intel" href="http://www.intel.com" />
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order" />
+ <link rel="stylesheet" href="../support/test-style.css">
+ <meta name="flags" content="" />
+ <meta name="assert" content="Check if the web engine can indentify order property." />
+ <style>
+ #test{
+ height: 200px;
+ width: 200px;
+ display: flex;
+ }
+ div#test02{
+ order: -1;
+ }
+ </style>
+ <script src="../../resources/testharness.js"></script>
+ <script src="../../resources/testharnessreport.js"></script>
+ </head>
+ <body>
+ <div id=log></div>
+ <div id=test><div id=test01>1</div><div id=test02>2</div><div id=test03>3</div></div>
+ <script type="text/javascript">
+ var t = async_test(document.title, {timeout:500});
+ t.step(function () {
+ assert_equals(document.getElementById("test01").offsetTop, document.getElementById("test02").offsetTop, "Rectangle 1 and 2 have the same offsetTop value");
+ assert_equals((document.getElementById("test02").offsetLeft >= document.getElementById("test01").offsetLeft), false, "Rectangle 2 have a smaller offsetLeft value than 1.");
+ });
+ t.done();
+ </script>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<title>CSS Flexbox: Basic percentage heights</title>
+<link rel="author" title="Google" href="https://www.google.com/" />
+<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#main-sizing" />
+<meta name="flags" content="dom" />
+<meta name="assert" content="This test checks that percentage heights on a flex item correctly resolve against the container." />
+<style>
+.flexbox {
+ display: flex;
+ background-color: #aaa;
+ position: relative;
+}
+.flexbox :nth-child(1) {
+ background-color: blue;
+}
+.flexbox :nth-child(2) {
+ background-color: green;
+}
+.flexbox :nth-child(3) {
+ background-color: red;
+}
+
+.flexbox > div {
+ width: 40%;
+ height: 40%;
+}
+.column {
+ flex-flow: column wrap;
+ width: 100px;
+ height: 100px;
+ align-content: flex-start;
+}
+</style>
+<script src="../../resources/testharness.js"></script>
+<script src="../../resources/testharnessreport.js"></script>
+<script src="../support/check-layout-th.js"></script>
+<body onload="checkLayout('.flexbox')">
+<div id=log></div>
+
+<div class="flexbox column">
+ <div data-expected-height="40" data-offset-x="0" data-offset-y="0"></div>
+ <div data-expected-height="40" data-offset-x="0" data-offset-y="40"></div>
+ <div data-expected-height="40" data-offset-x="40" data-offset-y="0"></div>
+</div>
+
+<div class="flexbox column">
+ <div data-expected-height="40" data-offset-x="0" data-offset-y="0" style="margin-bottom: 10%"></div>
+ <div data-expected-height="40" data-offset-x="40" data-offset-y="0" style="margin-bottom: 20%"></div>
+ <div data-expected-height="40" data-offset-x="40" data-offset-y="60"></div>
+</div>
+
+<div class="flexbox column">
+ <div data-expected-height="20" data-offset-x="0" data-offset-y="0" style="flex: 1; min-height: 0; max-height: 20%"></div>
+ <div data-expected-height="40" data-offset-x="0" data-offset-y="20"></div>
+ <div data-expected-height="40" data-offset-x="0" data-offset-y="60"></div>
+</div>
+
+<div class="flexbox column" style="writing-mode: vertical-rl">
+ <div data-expected-width="40" data-offset-x="60" data-offset-y="0"></div>
+ <div data-expected-width="40" data-offset-x="20" data-offset-y="0"></div>
+ <div data-expected-width="40" data-offset-x="60" data-offset-y="40"></div>
+</div>
+
+<div class="flexbox column" style="writing-mode: vertical-rl">
+ <div data-expected-width="40" data-offset-x="60" data-offset-y="0" style="margin-bottom: 10%"></div>
+ <div data-expected-width="40" data-offset-x="20" data-offset-y="0" style="margin-bottom: 20%"></div>
+ <div data-expected-width="40" data-offset-x="60" data-offset-y="60"></div>
+</div>
+
+<div class="flexbox column" style="writing-mode: vertical-rl">
+ <div data-expected-width="20" data-offset-x="80" data-offset-y="0" style="flex: 1; min-width: 0; max-width: 20%"></div>
+ <div data-expected-width="40" data-offset-x="40" data-offset-y="0"></div>
+ <div data-expected-width="40" data-offset-x="0" data-offset-y="0"></div>
+</div>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head><title>CSS Test: Change the value of 'order' property</title>
+<link rel="author" title="KeynesQu" href="mailto:keynesqu@sohu.com" />
+
+<style>
+
+.box {
+ margin:0 auto;
+ background:#CCC;
+ border-radius:5px;
+ width:600px;
+}
+
+.box div {
+ margin:0;
+ width:200px;
+ float:left;
+ text-align:center;
+}
+
+.box .red {
+ background:#F00;
+}
+.box .blue {
+ background:#00F;
+}
+.box .black {
+ color:#FFF;
+ background:#000;
+}
+
+
+
+
+</style>
+
+</head>
+
+<body>
+
+
+<!-- FLEX CONTAINER -->
+<div class="box">
+ <div class="blue">B</div>
+ <div class="red">A</div>
+ <div class="black">C</div>
+</div>
+
+
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ div {
+ background: green;
+ height: 100px;
+ width: 300px;
+ }
+</style>
+<body>
+ <p>Test passes if there is no red visible on the page.</p>
+ <div></div>
+</body>
--- /dev/null
+<!DOCTYPE html>
+<title>flexbox |css-box-justify-content</title>
+<link rel="author" href="ava656094@gmail.com" title="xiaoxia">
+<style>
+#flexbox {
+ background: green;
+ display: inline-block;
+ width: 300px;
+ height: 40px;
+ text-align:right;
+}
+.item{
+ display: inline-block;
+ text-align:left;
+ width:50px;
+ height: 30px;
+ }
+</style>
+
+<p>This test passes if the DIV5's position in the end and the div is Horizontal layout</p>
+<div id="flexbox">
+ <div class="item" style="background-color: rgb(242, 210, 80); color: rgb(41, 119, 248);">DIV1</div>
+ <div class="item" style="background-color: rgb(110, 8, 7); color: rgb(162, 152, 22);">DIV2</div>
+ <div class="item" style="background-color: rgb(215, 172, 243); color: rgb(74, 123, 110);">DIV3</div>
+ <div class="item" style="background-color: rgb(242, 133, 80); color: rgb(41, 119, 248);">DIV4</div>
+ <div class="item" style="background-color: rgb(242, 50, 80); color: rgb(41, 119, 248);">DIV5</div>
+</div>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Reftest Reference</title>
+ <link rel="author" title="Eiji Kitamura" href="mailto:agektmr+github@gmail.com">
+ <style type="text/css">
+
+ /* ADD STYLE BLOCK HERE (PREFERRABLE TO INLINE STYLES) */
+ div.flexbox {
+ height: 50px;
+ width: 300px;
+ border: 2px dotted black;
+ }
+ img {
+ width: 98px;
+ height: 48px;
+ background: purple;
+ border: 1px solid white;
+ }
+
+ </style>
+</head>
+<body>
+ <p>3 rectangular images fill out border.</p>
+
+ <!-- PAGE CONTENT -->
+ <div class="flexbox">
+ <!-- It is important that there is no linebreak between the <img> tags.
+ The line break would be rendered as whitespace, breaking the test.
+ -->
+ <img src="../../support/solidblue.png" /><img src="../../support/solidblue.png" /><img src="../../support/solidblue.png" />
+ </div>
+
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flex-basis Test</title>
+ <link rel="author" title="Chunsheng Zhang" href="mailto:zhangcs_423@163.com" />
+ <style type="text/css">
+ #container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border: 5px solid green;
+ width: 600px;
+ height: 200px;
+ padding: 5px;
+ border-radius: 3px;
+ position: absolute;
+ top: 70px;
+ left: 10px;
+ }
+ #a {
+ top: 148px;
+ left: 239px;
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ padding: 10px;
+ width: 30px;
+ height: 40px;
+ text-align: center;
+ flex: none;
+ }
+ #b {
+ top: 148px;
+ left: 293px;
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ padding: 10px;
+ width: 30px;
+ height: 40px;
+ text-align: center;
+ flex: none;
+ }
+ #c {
+ top: 148px;
+ left: 347px;
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ padding: 10px;
+ width: 30px;
+ height: 40px;
+ text-align: center;
+ flex: none;
+ }
+ </style>
+ </head>
+ <body>
+ <p>This case tests that flex items center</p>
+ <p>The test passes if there is no red</p>
+ <section id="container">
+ </section>
+ <div id="a" style="position:absolute"></div>
+ <div id="b" style="position:absolute"></div>
+ <div id="c" style="position:absolute"></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>flexible box flex item float effect</title>
+ <link rel="author" title="zhouli" href="mailto:liz@oupeng.com">
+ <style>
+ #myDiv{
+ position: relative;
+ }
+ #myDiv p{
+ width: 300px;
+ height: 30px;
+ display: inline-block;
+ margin: 0;
+ }
+ #first-p{
+ background-color: green;
+ }
+ #second-p{
+ background-color: blue;
+ }
+ #myDiv #fail-flag{
+ width: 600px;
+ background-color: red;
+ position: absolute;
+ left: 0;
+ top: 0;
+ z-index: -1;
+ }
+ </style>
+</head>
+<body>
+ <p>'float' have no effect on a flex item.</p>
+ <p>The test passes if there is a green square, a blue square and no red square.</p>
+<div id="myDiv">
+ <p id="first-p"> </p><p id="second-p"> </p><p id="fail-flag"> </p>
+</div>
+<script>
+</script>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<style>
+ .flex-container{
+ display: flex;
+ margin:20px;
+ background: #333;
+ }
+ .flex-item{
+ display: inline-block;
+ width:50px;
+ height:50px;
+ margin:20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+
+ .flex-container.flex-direction-row-reverse{
+ flex-direction : row-reverse;
+ }
+
+ .flex-container.flex-direction-column{
+ flex-direction : column;
+ }
+ .flex-container.flex-direction-column-reverse{
+ flex-direction : column-reverse;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:row</h1>
+ <div id="flex_container" class="flex-container flex-direction-row"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<style>
+ .flex-container{
+ display:block;
+ margin:20px;
+ background: #333;
+ line-height: 0px;
+ }
+ .flex-item{
+ display: inline-block;
+ width:50px;
+ height:50px;
+ margin:20px 20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+ .flex-container.flex-direction-row-reverse{
+ text-align: right;
+ }
+
+ .flex-container.flex-direction-column{
+ padding:20px 0px;
+ }
+
+ .flex-container.flex-direction-column .flex-item{
+ display: block;
+ margin:40px 20px;
+ }
+
+ .flex-container.flex-direction-column .flex-item.first{
+ margin-top:0px;
+ }
+ .flex-container.flex-direction-column .flex-item.last{
+ margin-bottom:0px;
+ }
+
+ .flex-container.flex-direction-column-reverse{
+ padding:20px 0px;
+ }
+
+ .flex-container.flex-direction-column-reverse .flex-item{
+ display: block;
+ margin:40px 20px;
+ }
+
+ .flex-container.flex-direction-column-reverse .flex-item.first{
+ margin-top:0px;
+ }
+ .flex-container.flex-direction-column-reverse .flex-item.last{
+ margin-bottom:0px;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:row</h1>
+ <div class="flex-container flex-direction-row"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div><div class="flex-item">new</div></div>
+
+ <h1>flex-direction:row-reverse</h1>
+ <div class="flex-container flex-direction-row-reverse"><div class="flex-item">new</div><div class="flex-item">3</div><div class="flex-item">2</div><div class="flex-item">1</div></div>
+
+ <h1>flex-direction:column</h1>
+ <div class="flex-container flex-direction-column"><div class="flex-item first">1</div><div class="flex-item">2</div><div class="flex-item">3</div><div class="flex-item last">new</div></div>
+
+ <h1>flex-direction:column-reverse</h1>
+ <div class="flex-container flex-direction-column-reverse"><div class="flex-item first">new</div><div class="flex-item">3</div><div class="flex-item">2</div><div class="flex-item last">1</div></div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+<title>CSS Test: flex flow direction</title>
+<link rel="author" title="houzhenyu" href="http://www.github.com/sskyy" />
+<style>
+ .flex-container{
+ display:block;
+ margin:20px;
+ background: #333;
+ line-height: 0px;
+ }
+ .flex-item{
+ display: inline-block;
+ width:50px;
+ height:50px;
+ margin:20px 20px;
+ background: #eee;
+ line-height: 50px;
+ text-align: center;
+ }
+
+ .flex-container.flex-direction-row{
+ flex-direction : row;
+ }
+ .flex-container.flex-direction-row-reverse{
+ text-align: right;
+ }
+
+ .flex-container.flex-direction-column{
+ padding:20px 0px;
+ }
+
+ .flex-container.flex-direction-column .flex-item{
+ display: block;
+ margin:40px 20px;
+ }
+
+ .flex-container.flex-direction-column .flex-item.first{
+ margin-top:0px;
+ }
+ .flex-container.flex-direction-column .flex-item.last{
+ margin-bottom:0px;
+ }
+
+ .flex-container.flex-direction-column-reverse{
+ padding:20px 0px;
+ }
+
+ .flex-container.flex-direction-column-reverse .flex-item{
+ display: block;
+ margin:40px 20px;
+ }
+
+ .flex-container.flex-direction-column-reverse .flex-item.first{
+ margin-top:0px;
+ }
+ .flex-container.flex-direction-column-reverse .flex-item.last{
+ margin-bottom:0px;
+ }
+</style>
+</head>
+<body>
+ <h1>flex-direction:row</h1>
+ <div class="flex-container flex-direction-row"><div class="flex-item">1</div><div class="flex-item">2</div><div class="flex-item">3</div></div>
+
+ <h1>flex-direction:row-reverse</h1>
+ <div class="flex-container flex-direction-row-reverse"><div class="flex-item">3</div><div class="flex-item">2</div><div class="flex-item">1</div></div>
+
+ <h1>flex-direction:column</h1>
+ <div class="flex-container flex-direction-column"><div class="flex-item first">1</div><div class="flex-item">2</div><div class="flex-item last">3</div></div>
+
+ <h1>flex-direction:column-reverse</h1>
+ <div class="flex-container flex-direction-column-reverse"><div class="flex-item first">3</div><div class="flex-item">2</div><div class="flex-item last">1</div></div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Flex-basis Test</title>
+ <link rel="author" title="Chunsheng Zhang" href="mailto:zhangcs_423@163.com" />
+ <style type="text/css">
+ #container {
+ border: 5px solid green;
+ width: 600px;
+ height: 200px;
+ padding: 5px;
+ border-radius: 3px;
+ position: absolute;
+ top: 70px;
+ left: 10px;
+ }
+ #flex {
+ border: 2px dotted blue;
+ background: green;
+ border-radius: 3px;
+ position: absolute;
+ top: 73px;
+ left: 166.5px;
+ width: 253px;
+ height: 40px;
+ padding: 10px;
+ }
+ </style>
+ </head>
+ <body>
+ <p>This case tests that flex items flexibility</p>
+ <p>The test passes if there is no red</p>
+ <section id="container">
+ <div id="flex"></div>
+ </section>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Reference File</title>
+ <link rel="author" title="Ping Huang" href="mailto:phuangce@gmail.com" />
+ <style type="text/css">
+ #container {
+ position: absolute;
+ top: 100px;
+ left: 10px;
+ width: 200px;
+ height: 300px;
+ }
+
+ .box {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+ }
+
+ #box1 {
+ margin: 50px 0;
+ }
+
+ #box2 {
+ margin: 100px 0;
+ }
+
+ </style>
+</head>
+<body>
+ <p>The test passes if there are two green boxes and no red.</p>
+ <div id="container">
+ <div id="box1" class="box"></div>
+ <div id="box2" class="box"></div>
+ </div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Test: 'display' property set to 'flex'</title>
+ <link rel="author" title="Hua Zhao" href="mailto:zhaohua.design@163.com" />
+
+ <style type="text/css">
+ input{
+ margin:0;
+ padding:0;
+ vertical-align:top;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+
+ <div id="container">
+ <input type="text" value="input1" />
+ <input type="radio" />
+ </div>
+</body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>CSS Reftest Reference: Flexbox direction and wrapping</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <meta name="flags" content="">
+ <style>
+
+ /* Ref test styles */
+
+ .flex-wrapper div{
+ display: inline-block;
+ }
+
+
+ /* Test-series styles */
+
+ .flex-wrapper {
+ width: 120px;
+ height: 120px;
+
+ /* should only display on error */
+ background: red;
+
+ /* Enforce writing mode */
+ direction: ltr;
+ writing-mode: horizontal-tb;
+ }
+
+ .flex-wrapper div {
+ width: 38px;
+ height: 38px;
+
+ background: green;
+ border: 1px solid limegreen;
+
+ color: white;
+ line-height: 40px;
+ text-align: center;
+ vertical-align: middle;
+ }
+ </style>
+ </head>
+ <body>
+ <p>The test passes if there is a 3x3 grid of green squares, numbered 1-9 left-to-right and top-to-bottom, and there is no red.</p>
+ <div class="flex-wrapper">
+ <div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>7</div><div>8</div><div>9</div>
+ </div>
+ </body>
+</html>
\ No newline at end of file
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Reftest Reference: Flexbox flex-wrap: nowrap</title>
+ <link rel="author" title="Gavin Elster" href="mailto:gavin.elster@me.com">
+ <link rel="reviewer" title="Elika J. Etemad" href="http://fantasai.inkedblade.net/contact">
+ <meta name="flags" content="">
+ <style type="text/css">
+ div {
+ width: 120px;
+ height: 120px;
+ background: green;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passes if there is a green square and no red.</p>
+ <div></div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Reference</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<style>
+ #blue {
+ background: blue;
+ height: 100px;
+ width: 150px;
+ }
+ #orange {
+ background: orange;
+ height: 100px;
+ left: 150px;
+ position: relative;
+ top: -100px;
+ width: 150px;
+ }
+</style>
+<body>
+ <p>Test passes if there is a single blue rectangle on the left, a single orange rectangle directly to its right, and there is no red visible on the page.</p>
+ <div id="blue"></div>
+ <div id="orange"></div>
+</body>
--- /dev/null
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <title>CSS Reftest Reference</title>
+ <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/" />
+ <style type="text/css"><![CDATA[
+ div
+ {
+ background-color: green;
+ height: 100px;
+ width: 100px;
+ }
+ ]]></style>
+ </head>
+ <body>
+ <p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
+ <div></div>
+ </body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - center</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ width: 20em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span:nth-child(3), span:nth-child(4) {
+ margin: 2em 1em;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 0 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a centered 2*2 table.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - flex-end</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 8em;
+ width: 20em;
+ background: red;
+ margin: 1em;
+ padding-top: 6em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are at the bottom of container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - space-between</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 2.5em 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are at the bottom of container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - space-between</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ .first, .second {
+ margin-bottom: 112px;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are spaced equally apart.</p>
+ <div class="container">
+ <span class="first">first</span>
+ <span class="second">second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - flex-start</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are at the top of the container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: display proprety - flex</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ width: 3em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ .success {
+ background: green;
+ width: 100%;
+ height: 100%;
+ display: block;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you can't find red color.</p>
+ <div class="container">
+ <span class="success">Hello</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - column</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ }
+ span ~ span {
+ margin: 2em 1em 1em;
+ }
+ span {
+ display: block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arraged vertically.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - column-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ }
+ span ~ span {
+ margin: 2em 1em 1em;
+ }
+ span {
+ display: block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arraged vertically and reversed.</p>
+ <div class="container">
+ <span>forth</span>
+ <span>third</span>
+ <span>second</span>
+ <span>first</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - row-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ text-align: right;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ text-align: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arranged horizontally and the order of cells are reversed.</p>
+ <div class="container">
+ <span>forth</span><span>third</span><span>second</span><span>first</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: display proprety - inline-flex</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ }
+ .greenSquare {
+ display: inline-block;
+ margin-top: -200px;
+ background: green;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a green block which its text is 'Success!'.</p>
+ <div class="container">
+ <!-- This is the square that should not be visible if the test passes -->
+ <div class="greenSquare">Success!</div>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: order proprety - value</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if all the cells are reversed.</p>
+ <div class="container">
+ <span class="first">forth</span><span class="second">third</span><span class="third">second</span><span class="forth">first</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-wrap proprety - wrap</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ width: 20em;
+ height: 6.5em;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2 * 2 table on the page.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-wrap proprety - wrap-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ width: 20em;
+ height: 6.5em;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ float: left;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2 * 2 table on the page and the order of them are reversed.</p>
+ <div class="container">
+ <span>third</span>
+ <span>forth</span>
+ <span>first</span>
+ <span>second</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - center</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-align-content-center-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ width: 20em;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ flex: none;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a centered 2*2 table.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - flex-end</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-align-content-end-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: flex-end;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ flex: none;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are at the bottom of container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - space-around</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-align-content-space-around-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: space-around;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ flex: none;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are spaced equally apart of container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - space-between</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-align-content-space-between-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: space-between;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ flex: none;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are spaced equally apart.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: align-content property - flex-start</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#align-content-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-align-content-start-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 14em;
+ width: 20em;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: flex-start;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ flex: none;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2*2 table and all the cells are at the top of the container.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: display proprety - flex</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-containers">
+ <link rel="match" href="reference/ttwf-reftest-flex-base-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ width: 3em;
+ display: flex;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ .success {
+ background: green;
+ width: 3em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you can't find red color.</p>
+ <div class="container">
+ <span class="success">Hello</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - column-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-direction-column-reverse-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ display: flex;
+ flex-direction: column-reverse;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arraged vertically and reversed.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - column</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-direction-column-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arraged vertically.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-direction proprety - row-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-direction-property">
+ <link rel="match" href="reference/ttwf-reftest-flex-direction-row-reverse-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ display: flex;
+ flex-direction: row-reverse;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see all the cells are arranged horizontally and the order of cells are reversed.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: display proprety - inline-flex</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#valdef-display-inline-flex">
+ <link rel="match" href="reference/ttwf-reftest-flex-inline-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ }
+ .greenSquare {
+ display: inline-flex;
+ margin-top: -200px;
+ background: green;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a green block which its text is 'Success!'.</p>
+ <div class="container">
+ <!-- This is the square that should not be visible if the test passes -->
+ <div class="greenSquare">Success!</div>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: order proprety - value</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-order">
+ <link rel="match" href="reference/ttwf-reftest-flex-order-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ .container {
+ position: relative;
+ height: 6em;
+ display: flex;
+ background: red;
+ margin: 1em;
+ border: 1px solid black;
+ }
+ span {
+ height: 2em;
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ .first {
+ order: 1;
+ }
+ .second {
+ order: 2;
+ }
+ .third {
+ order: 3;
+ }
+ .forth {
+ order: 4;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if all the cells are reversed.</p>
+ <div class="container">
+ <span class="forth">first</span>
+ <span class="third">second</span>
+ <span class="second">third</span>
+ <span class="first">forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-wrap proprety - wrap-reverse</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+ <link rel="match" href="reference/ttwf-reftest-flex-wrap-reverse-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ display: flex;
+ flex-wrap: wrap-reverse;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ width: 20em;
+ height: 6.5em;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2 * 2 table on the page and the order of them are reversed.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+<!DOCTYPE html>
+<html>
+<head>
+ <title>CSS Flexible Box Test: flex-wrap proprety - wrap</title>
+ <link rel="author" title="haosdent" href="mailto:haosdent@gmail.com">
+ <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#propdef-flex-wrap">
+ <link rel="match" href="reference/ttwf-reftest-flex-wrap-ref.html">
+ <meta name="assert" content="Statement describing what the test case is asserting">
+ <style type="text/css">
+ /* Positioned container allows for the self-describing statement to still
+ be visible in the case of failure */
+ .container {
+ position: relative;
+ display: flex;
+ flex-wrap: wrap;
+ background: red;
+ margin: 1em 0;
+ border: 1px solid black;
+ width: 20em;
+ height: 6.5em;
+ }
+ span {
+ display: inline-block;
+ background: green;
+ color: white;
+ margin: 1em;
+ width: 8em;
+ }
+ </style>
+</head>
+<body>
+ <p>The test passed if you see a 2 * 2 table on the page.</p>
+ <div class="container">
+ <span>first</span>
+ <span>second</span>
+ <span>third</span>
+ <span>forth</span>
+ </div>
+</body>
+</html>
--- /dev/null
+(function() {
+// Test is initiated from body.onload, so explicit done() call is required.
+setup({ explicit_done: true });
+
+function checkSubtreeExpectedValues(t, parent, prefix)
+{
+ var checkedLayout = checkExpectedValues(t, parent, prefix);
+ Array.prototype.forEach.call(parent.childNodes, function(node) {
+ checkedLayout |= checkSubtreeExpectedValues(t, node, prefix);
+ });
+ return checkedLayout;
+}
+
+function checkAttribute(output, node, attribute)
+{
+ var result = node.getAttribute && node.getAttribute(attribute);
+ output.checked |= !!result;
+ return result;
+}
+
+function assert_tolerance(actual, expected, message)
+{
+ if (isNaN(expected) || Math.abs(actual - expected) >= 1) {
+ assert_equals(actual, Number(expected), message);
+ }
+}
+
+function checkExpectedValues(t, node, prefix)
+{
+ var output = { checked: false };
+
+ var expectedWidth = checkAttribute(output, node, "data-expected-width");
+ if (expectedWidth) {
+ assert_tolerance(node.offsetWidth, expectedWidth, prefix + "width");
+ }
+
+ var expectedHeight = checkAttribute(output, node, "data-expected-height");
+ if (expectedHeight) {
+ assert_tolerance(node.offsetHeight, expectedHeight, prefix + "height");
+ }
+
+ var expectedOffset = checkAttribute(output, node, "data-offset-x");
+ if (expectedOffset) {
+ assert_tolerance(node.offsetLeft, expectedOffset, prefix + "offsetLeft");
+ }
+
+ var expectedOffset = checkAttribute(output, node, "data-offset-y");
+ if (expectedOffset) {
+ assert_tolerance(node.offsetTop, expectedOffset, prefix + "offsetTop");
+ }
+
+ var expectedWidth = checkAttribute(output, node, "data-expected-client-width");
+ if (expectedWidth) {
+ assert_tolerance(node.clientWidth, expectedWidth, prefix + "clientWidth");
+ }
+
+ var expectedHeight = checkAttribute(output, node, "data-expected-client-height");
+ if (expectedHeight) {
+ assert_tolerance(node.clientHeight, expectedHeight, prefix + "clientHeight");
+ }
+
+ var expectedWidth = checkAttribute(output, node, "data-expected-scroll-width");
+ if (expectedWidth) {
+ assert_tolerance(node.scrollWidth, expectedWidth, prefix + "scrollWidth");
+ }
+
+ var expectedHeight = checkAttribute(output, node, "data-expected-scroll-height");
+ if (expectedHeight) {
+ assert_tolerance(node.scrollHeight, expectedHeight, prefix + "scrollHeight");
+ }
+
+ var expectedOffset = checkAttribute(output, node, "data-total-x");
+ if (expectedOffset) {
+ var totalLeft = node.clientLeft + node.offsetLeft;
+ assert_tolerance(totalLeft, expectedOffset, prefix +
+ "clientLeft+offsetLeft (" + node.clientLeft + " + " + node.offsetLeft + ")");
+ }
+
+ var expectedOffset = checkAttribute(output, node, "data-total-y");
+ if (expectedOffset) {
+ var totalTop = node.clientTop + node.offsetTop;
+ assert_tolerance(totalTop, expectedOffset, prefix +
+ "clientTop+offsetTop (" + node.clientTop + " + " + node.offsetTop + ")");
+ }
+
+ var expectedDisplay = checkAttribute(output, node, "data-expected-display");
+ if (expectedDisplay) {
+ var actualDisplay = getComputedStyle(node).display;
+ assert_equals(actualDisplay, expectedDisplay, prefix + "display");
+ }
+
+ var expectedPaddingTop = checkAttribute(output, node, "data-expected-padding-top");
+ if (expectedPaddingTop) {
+ var actualPaddingTop = getComputedStyle(node).paddingTop;
+ // Trim the unit "px" from the output.
+ actualPaddingTop = actualPaddingTop.slice(0, -2);
+ assert_equals(actualPaddingTop, expectedPaddingTop, prefix + "padding-top");
+ }
+
+ var expectedPaddingBottom = checkAttribute(output, node, "data-expected-padding-bottom");
+ if (expectedPaddingBottom) {
+ var actualPaddingBottom = getComputedStyle(node).paddingBottom;
+ // Trim the unit "px" from the output.
+ actualPaddingBottom = actualPaddingBottom.slice(0, -2);
+ assert_equals(actualPaddingBottom, expectedPaddingBottom, prefix + "padding-bottom");
+ }
+
+ var expectedPaddingLeft = checkAttribute(output, node, "data-expected-padding-left");
+ if (expectedPaddingLeft) {
+ var actualPaddingLeft = getComputedStyle(node).paddingLeft;
+ // Trim the unit "px" from the output.
+ actualPaddingLeft = actualPaddingLeft.slice(0, -2);
+ assert_equals(actualPaddingLeft, expectedPaddingLeft, prefix + "padding-left");
+ }
+
+ var expectedPaddingRight = checkAttribute(output, node, "data-expected-padding-right");
+ if (expectedPaddingRight) {
+ var actualPaddingRight = getComputedStyle(node).paddingRight;
+ // Trim the unit "px" from the output.
+ actualPaddingRight = actualPaddingRight.slice(0, -2);
+ assert_equals(actualPaddingRight, expectedPaddingRight, prefix + "padding-right");
+ }
+
+ var expectedMarginTop = checkAttribute(output, node, "data-expected-margin-top");
+ if (expectedMarginTop) {
+ var actualMarginTop = getComputedStyle(node).marginTop;
+ // Trim the unit "px" from the output.
+ actualMarginTop = actualMarginTop.slice(0, -2);
+ assert_equals(actualMarginTop, expectedMarginTop, prefix + "margin-top");
+ }
+
+ var expectedMarginBottom = checkAttribute(output, node, "data-expected-margin-bottom");
+ if (expectedMarginBottom) {
+ var actualMarginBottom = getComputedStyle(node).marginBottom;
+ // Trim the unit "px" from the output.
+ actualMarginBottom = actualMarginBottom.slice(0, -2);
+ assert_equals(actualMarginBottom, expectedMarginBottom, prefix + "margin-bottom");
+ }
+
+ var expectedMarginLeft = checkAttribute(output, node, "data-expected-margin-left");
+ if (expectedMarginLeft) {
+ var actualMarginLeft = getComputedStyle(node).marginLeft;
+ // Trim the unit "px" from the output.
+ actualMarginLeft = actualMarginLeft.slice(0, -2);
+ assert_equals(actualMarginLeft, expectedMarginLeft, prefix + "margin-left");
+ }
+
+ var expectedMarginRight = checkAttribute(output, node, "data-expected-margin-right");
+ if (expectedMarginRight) {
+ var actualMarginRight = getComputedStyle(node).marginRight;
+ // Trim the unit "px" from the output.
+ actualMarginRight = actualMarginRight.slice(0, -2);
+ assert_equals(actualMarginRight, expectedMarginRight, prefix + "margin-right");
+ }
+
+ return output.checked;
+}
+
+window.checkLayout = function(selectorList, outputContainer)
+{
+ if (!selectorList) {
+ console.error("You must provide a CSS selector of nodes to check.");
+ return;
+ }
+ var nodes = document.querySelectorAll(selectorList);
+ var testNumber = 0;
+ nodes = Array.prototype.slice.call(nodes);
+ nodes.reverse();
+ var checkedLayout = false;
+ Array.prototype.forEach.call(nodes, function(node) {
+ test(function(t) {
+ var container = node.parentNode.className == 'container' ? node.parentNode : node;
+ var prefix = "\n" + container.outerHTML + "\n";
+ var passed = false;
+ try {
+ checkedLayout |= checkExpectedValues(t, node.parentNode, prefix);
+ checkedLayout |= checkSubtreeExpectedValues(t, node, prefix);
+ passed = true;
+ } finally {
+ checkedLayout |= !passed;
+ }
+ }, selectorList + ' ' + String(++testNumber));
+ });
+ if (!checkedLayout) {
+ console.error("No valid data-* attributes found in selector list : " + selectorList);
+ }
+ done();
+};
+
+})();
--- /dev/null
+/*
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ haox.li <haox.li@intel.com>
+
+*/
+
+var browser = (function getBrowser() {
+ if (navigator.userAgent.indexOf("WebKit") > 0) {
+ return "webkit";
+ }
+ if (navigator.userAgent.indexOf("Firefox") > 0) {
+ return "moz";
+ }
+ if (navigator.userAgent.indexOf("MSIE") > 0) {
+ return "msie";
+ }
+ if (navigator.userAgent.indexOf("Safari") > 0) {
+ return "safari";
+ }
+ if (navigator.userAgent.indexOf("Camino") > 0) {
+ return "camino";
+ }
+ if (navigator.userAgent.indexOf("Gecko/") > 0) {
+ return "gecko";
+ }
+})();
+
+//get style propoty
+function GetCurrentStyle(prop) {
+ var div = document.querySelector("#testDiv"); //object
+ var headprop = headProp(prop);
+ return getComputedStyle(div)[headprop];
+}
+
+//
+function headProp(s) {
+ var div = document.querySelector("#testDiv");
+ if (s in div.style) {
+ return s;
+ }
+ s = s[0].toUpperCase() + s.slice(1);
+ var prefixes = ["ms", "Moz", "moz", "webkit", "O"];
+ for (var i = 0; i < prefixes.length; i++) {
+ if ((prefixes[i] + s) in div.style) {
+ return prefixes[i] + s;
+ }
+ }
+ return s;
+}
+
+//get style propoty
+function GetCurrentStyleWithId(id,prop) {
+ var div = document.querySelector("#" + id); //object
+ var headprop = headPropWithId(id,prop);
+ return getComputedStyle(div)[headprop];
+}
+
+//
+function headPropWithId(id,s) {
+ var div = document.querySelector("#" + id);
+ if (s in div.style) {
+ return s;
+ }
+ s = s[0].toUpperCase() + s.slice(1);
+ var prefixes = ["ms", "Moz", "moz", "webkit", "O"];
+ for (var i = 0; i < prefixes.length; i++) {
+ if ((prefixes[i] + s) in div.style) {
+ return prefixes[i] + s;
+ }
+ }
+ return s;
+}
+
+//style existence check
+function hasStyle(name, styles) {
+ var arr = name.split("-");
+ var nameStr = arr[0];
+ for(i = 1; i < arr.length; i++) {
+ nameStr = nameStr + arr[i][0].toUpperCase() + arr[i].slice(1);
+ }
+ //name without prefix
+ if(nameStr in styles) {
+ return true;
+ }
+ //browser prefixes
+ var prefixes = ["ms", "Moz", "moz", "webkit", "O"];
+ //Uppercase first letter
+ nameStr = nameStr[0].toUpperCase() + nameStr.slice(1);
+ for (i in prefixes) {
+ //name with prefix
+ if ((prefixes[i] + nameStr) in styles) {
+ return true;
+ }
+ }
+ return false;
+}
--- /dev/null
+ #test01, #test02, #test03{
+ width: 50px;
+ height: 50px;
+ text-align:center;
+ font-size: 20px;
+ }
+ #test{
+ background: #ff0000;
+ }
+ #test01{
+ background: #7FFF00;
+ }
+ #test02{
+ background: #00FFFF;
+ }
+ #test03{
+ background: #4169E1;
+ }
--- /dev/null
+#!/usr/bin/env python
+
+import os
+import shutil
+import glob
+import time
+import sys
+import subprocess
+from optparse import OptionParser, make_option\r
+import ConfigParser
+
+
+SCRIPT_DIR = os.path.dirname(os.path.abspath(__file__))
+PARAMETERS = None
+ADB_CMD = "adb"
+
+
+def doCMD(cmd):
+ # Do not need handle timeout in this short script, let tool do it
+ print "-->> \"%s\"" % cmd
+ output = []
+ cmd_return_code = 1
+ cmd_proc = subprocess.Popen(
+ cmd, stdout=subprocess.PIPE, stderr=subprocess.STDOUT, shell=True)
+
+ while True:
+ output_line = cmd_proc.stdout.readline().strip("\r\n")
+ cmd_return_code = cmd_proc.poll()
+ if output_line == '' and cmd_return_code != None:
+ break
+ sys.stdout.write("%s\n" % output_line)
+ sys.stdout.flush()
+ output.append(output_line)
+
+ return (cmd_return_code, output)
+
+
+def uninstPKGs():
+ action_status = True
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ for file in files:
+ if file.endswith(".apk"):
+ cmd = "%s -s %s uninstall org.xwalk.%s" % (
+ ADB_CMD, PARAMETERS.device, os.path.basename(os.path.splitext(file)[0]))
+ (return_code, output) = doCMD(cmd)
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+ return action_status
+
+
+def instPKGs():
+ action_status = True
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ for file in files:
+ if file.endswith(".apk"):
+ cmd = "%s -s %s install %s" % (ADB_CMD,
+ PARAMETERS.device, os.path.join(root, file))
+ (return_code, output) = doCMD(cmd)
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+ return action_status
+
+
+def main():
+ try:
+ usage = "usage: inst.py -i"
+ opts_parser = OptionParser(usage=usage)
+ opts_parser.add_option(
+ "-s", dest="device", action="store", help="Specify device")
+ opts_parser.add_option(
+ "-i", dest="binstpkg", action="store_true", help="Install package")
+ opts_parser.add_option(
+ "-u", dest="buninstpkg", action="store_true", help="Uninstall package")
+ global PARAMETERS
+ (PARAMETERS, args) = opts_parser.parse_args()
+ except Exception, e:
+ print "Got wrong option: %s, exit ..." % e
+ sys.exit(1)
+
+ if not PARAMETERS.device:
+ (return_code, output) = doCMD("adb devices")
+ for line in output:
+ if str.find(line, "\tdevice") != -1:
+ PARAMETERS.device = line.split("\t")[0]
+ break
+
+ if not PARAMETERS.device:
+ print "No device found"
+ sys.exit(1)
+
+ if PARAMETERS.binstpkg and PARAMETERS.buninstpkg:
+ print "-i and -u are conflict"
+ sys.exit(1)
+
+ if PARAMETERS.buninstpkg:
+ if not uninstPKGs():
+ sys.exit(1)
+ else:
+ if not instPKGs():
+ sys.exit(1)
+
+if __name__ == "__main__":
+ main()
+ sys.exit(0)
--- /dev/null
+#!/usr/bin/env python
+
+import os
+import shutil
+import glob
+import time
+import sys
+import subprocess
+import string
+from optparse import OptionParser, make_option\r
+import ConfigParser
+
+
+SCRIPT_DIR = os.path.dirname(os.path.abspath(__file__))
+PKG_NAME = os.path.basename(SCRIPT_DIR)
+PARAMETERS = None
+#XW_ENV = "export DBUS_SESSION_BUS_ADDRESS=unix:path=/run/user/5000/dbus/user_bus_socket"
+TCT_CONFIG_FILE = "/opt/tools/TCT_CONFIG"
+tct_parser = ConfigParser.ConfigParser()
+tct_parser.read(TCT_CONFIG_FILE)
+SRC_DIR = tct_parser.get('DEVICE', 'DEVICE_SUITE_TARGET_30')
+PKG_SRC_DIR = "%s/tct/opt/%s" % (SRC_DIR, PKG_NAME)
+
+
+def doCMD(cmd):
+ # Do not need handle timeout in this short script, let tool do it
+ print "-->> \"%s\"" % cmd
+ output = []
+ cmd_return_code = 1
+ cmd_proc = subprocess.Popen(
+ cmd, stdout=subprocess.PIPE, stderr=subprocess.STDOUT, shell=True)
+
+ while True:
+ output_line = cmd_proc.stdout.readline().strip("\r\n")
+ cmd_return_code = cmd_proc.poll()
+ if output_line == '' and cmd_return_code != None:
+ break
+ sys.stdout.write("%s\n" % output_line)
+ sys.stdout.flush()
+ output.append(output_line)
+
+ return (cmd_return_code, output)
+
+def updateCMD(cmd=None):
+ if "pkgcmd" in cmd:
+ cmd = "su - %s -c '%s;%s'" % (PARAMETERS.user, XW_ENV, cmd)
+ return cmd
+def getUSERID():
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell id -u %s" % (
+ PARAMETERS.device, PARAMETERS.user)
+ else:
+ cmd = "ssh %s \"id -u %s\"" % (
+ PARAMETERS.device, PARAMETERS.user )
+ return doCMD(cmd)
+
+
+
+
+def getPKGID(pkg_name=None):
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell %s" % (
+ PARAMETERS.device, updateCMD('pkgcmd -l'))
+ else:
+ cmd = "ssh %s \"%s\"" % (
+ PARAMETERS.device, updateCMD('pkgcmd -l'))
+
+ (return_code, output) = doCMD(cmd)
+ if return_code != 0:
+ return None
+
+ test_pkg_id = None
+ for line in output:
+ if line.find("[" + pkg_name + "]") != -1:
+ pkgidIndex = line.split().index("pkgid")
+ test_pkg_id = line.split()[pkgidIndex+1].strip("[]")
+ break
+ return test_pkg_id
+
+
+def doRemoteCMD(cmd=None):
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell %s" % (PARAMETERS.device, updateCMD(cmd))
+ else:
+ cmd = "ssh %s \"%s\"" % (PARAMETERS.device, updateCMD(cmd))
+
+ return doCMD(cmd)
+
+
+def doRemoteCopy(src=None, dest=None):
+ if PARAMETERS.mode == "SDB":
+ cmd_prefix = "sdb -s %s push" % PARAMETERS.device
+ cmd = "%s %s %s" % (cmd_prefix, src, dest)
+ else:
+ cmd = "scp -r %s %s:/%s" % (src, PARAMETERS.device, dest)
+
+ (return_code, output) = doCMD(cmd)
+ doRemoteCMD("sync")
+
+ if return_code != 0:
+ return True
+ else:
+ return False
+
+
+def uninstPKGs():
+ action_status = True
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ if root.endswith("mediasrc"):
+ continue
+
+ for file in files:
+ if file.endswith(".wgt"):
+ pkg_id = getPKGID(os.path.basename(os.path.splitext(file)[0]))
+ if not pkg_id:
+ action_status = False
+ continue
+ (return_code, output) = doRemoteCMD(
+ "pkgcmd -u -t wgt -q -n %s" % pkg_id)
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+
+ (return_code, output) = doRemoteCMD(
+ "rm -rf %s" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+
+ return action_status
+
+
+def instPKGs():
+ action_status = True
+ (return_code, output) = doRemoteCMD(
+ "mkdir -p %s" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ if root.endswith("mediasrc"):
+ continue
+
+ for file in files:
+ if file.endswith(".wgt"):
+ if not doRemoteCopy(os.path.join(root, file), "%s/%s" % (SRC_DIR, file)):
+ action_status = False
+ (return_code, output) = doRemoteCMD(
+ "pkgcmd -i -t wgt -q -p %s/%s" % (SRC_DIR, file))
+ doRemoteCMD("rm -rf %s/%s" % (SRC_DIR, file))
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+
+ # Do some special copy/delete... steps
+ '''
+ (return_code, output) = doRemoteCMD(
+ "mkdir -p %s/tests" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+
+ if not doRemoteCopy("specname/tests", "%s/tests" % PKG_SRC_DIR):
+ action_status = False
+ '''
+
+ return action_status
+
+
+def main():
+ try:
+ usage = "usage: inst.py -i"
+ opts_parser = OptionParser(usage=usage)
+ opts_parser.add_option(
+ "-m", dest="mode", action="store", help="Specify mode")
+ opts_parser.add_option(
+ "-s", dest="device", action="store", help="Specify device")
+ opts_parser.add_option(
+ "-i", dest="binstpkg", action="store_true", help="Install package")
+ opts_parser.add_option(
+ "-u", dest="buninstpkg", action="store_true", help="Uninstall package")
+ opts_parser.add_option(
+ "-a", dest="user", action="store", help="User name")
+ global PARAMETERS
+ (PARAMETERS, args) = opts_parser.parse_args()
+ except Exception, e:
+ print "Got wrong option: %s, exit ..." % e
+ sys.exit(1)
+
+ if not PARAMETERS.user:
+ PARAMETERS.user = "owner"
+ if not PARAMETERS.mode:
+ PARAMETERS.mode = "SDB"
+
+ if PARAMETERS.mode == "SDB":
+ if not PARAMETERS.device:
+ (return_code, output) = doCMD("sdb devices")
+ for line in output:
+ if str.find(line, "\tdevice") != -1:
+ PARAMETERS.device = line.split("\t")[0]
+ break
+ else:
+ PARAMETERS.mode = "SSH"
+
+ if not PARAMETERS.device:
+ print "No device provided"
+ sys.exit(1)
+
+ user_info = getUSERID()
+ re_code = user_info[0]
+ if re_code == 0 :
+ global XW_ENV
+ userid = user_info[1][0]
+ XW_ENV = "export DBUS_SESSION_BUS_ADDRESS=unix:path=/run/user/%s/dbus/user_bus_socket"%str(userid)
+ else:
+ print "[Error] cmd commands error : %s"%str(user_info[1])
+ sys.exit(1)
+ if PARAMETERS.binstpkg and PARAMETERS.buninstpkg:
+ print "-i and -u are conflict"
+ sys.exit(1)
+
+ if PARAMETERS.buninstpkg:
+ if not uninstPKGs():
+ sys.exit(1)
+ else:
+ if not instPKGs():
+ sys.exit(1)
+
+if __name__ == "__main__":
+ main()
+ sys.exit(0)
--- /dev/null
+#!/usr/bin/env python
+
+import os
+import shutil
+import glob
+import time
+import sys
+import subprocess
+import string
+from optparse import OptionParser, make_option\r
+import ConfigParser
+
+
+SCRIPT_DIR = os.path.dirname(os.path.abspath(__file__))
+PKG_NAME = os.path.basename(SCRIPT_DIR)
+PARAMETERS = None
+#XW_ENV = "export DBUS_SESSION_BUS_ADDRESS=unix:path=/run/user/5000/dbus/user_bus_socket"
+TCT_CONFIG_FILE = "/opt/tools/TCT_CONFIG"
+tct_parser = ConfigParser.ConfigParser()
+tct_parser.read(TCT_CONFIG_FILE)
+SRC_DIR = tct_parser.get('DEVICE', 'DEVICE_SUITE_TARGET_30')
+PKG_SRC_DIR = "%s/tct/opt/%s" % (SRC_DIR, PKG_NAME)
+
+
+def doCMD(cmd):
+ # Do not need handle timeout in this short script, let tool do it
+ print "-->> \"%s\"" % cmd
+ output = []
+ cmd_return_code = 1
+ cmd_proc = subprocess.Popen(
+ cmd, stdout=subprocess.PIPE, stderr=subprocess.STDOUT, shell=True)
+
+ while True:
+ output_line = cmd_proc.stdout.readline().strip("\r\n")
+ cmd_return_code = cmd_proc.poll()
+ if output_line == '' and cmd_return_code != None:
+ break
+ sys.stdout.write("%s\n" % output_line)
+ sys.stdout.flush()
+ output.append(output_line)
+
+ return (cmd_return_code, output)
+
+
+def updateCMD(cmd=None):
+ if "pkgcmd" in cmd:
+ cmd = "su - %s -c '%s;%s'" % (PARAMETERS.user, XW_ENV, cmd)
+ return cmd
+def getUSERID():
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell id -u %s" % (
+ PARAMETERS.device, PARAMETERS.user)
+ else:
+ cmd = "ssh %s \"id -u %s\"" % (
+ PARAMETERS.device, PARAMETERS.user )
+ return doCMD(cmd)
+
+
+
+
+def getPKGID(pkg_name=None):
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell %s" % (
+ PARAMETERS.device, updateCMD('pkgcmd -l'))
+ else:
+ cmd = "ssh %s \"%s\"" % (
+ PARAMETERS.device, updateCMD('pkgcmd -l'))
+
+ (return_code, output) = doCMD(cmd)
+ if return_code != 0:
+ return None
+
+ test_pkg_id = None
+ for line in output:
+ if line.find("[" + pkg_name + "]") != -1:
+ pkgidIndex = line.split().index("pkgid")
+ test_pkg_id = line.split()[pkgidIndex+1].strip("[]")
+ break
+ return test_pkg_id
+
+
+def doRemoteCMD(cmd=None):
+ if PARAMETERS.mode == "SDB":
+ cmd = "sdb -s %s shell %s" % (PARAMETERS.device, updateCMD(cmd))
+ else:
+ cmd = "ssh %s \"%s\"" % (PARAMETERS.device, updateCMD(cmd))
+
+ return doCMD(cmd)
+
+
+def doRemoteCopy(src=None, dest=None):
+ if PARAMETERS.mode == "SDB":
+ cmd_prefix = "sdb -s %s push" % PARAMETERS.device
+ cmd = "%s %s %s" % (cmd_prefix, src, dest)
+ else:
+ cmd = "scp -r %s %s:/%s" % (src, PARAMETERS.device, dest)
+
+ (return_code, output) = doCMD(cmd)
+ doRemoteCMD("sync")
+
+ if return_code != 0:
+ return True
+ else:
+ return False
+
+
+def uninstPKGs():
+ action_status = True
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ if root.endswith("mediasrc"):
+ continue
+
+ for file in files:
+ if file.endswith(".xpk"):
+ pkg_id = getPKGID(os.path.basename(os.path.splitext(file)[0]))
+ if not pkg_id:
+ action_status = False
+ continue
+ (return_code, output) = doRemoteCMD(
+ "pkgcmd -u -t xpk -q -n %s" % pkg_id)
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+
+ (return_code, output) = doRemoteCMD(
+ "rm -rf %s" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+
+ return action_status
+
+
+def instPKGs():
+ action_status = True
+ (return_code, output) = doRemoteCMD(
+ "mkdir -p %s" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+ for root, dirs, files in os.walk(SCRIPT_DIR):
+ if root.endswith("mediasrc"):
+ continue
+
+ for file in files:
+ if file.endswith(".xpk"):
+ if not doRemoteCopy(os.path.join(root, file), "%s/%s" % (SRC_DIR, file)):
+ action_status = False
+ (return_code, output) = doRemoteCMD(
+ "pkgcmd -i -t xpk -q -p %s/%s" % (SRC_DIR, file))
+ doRemoteCMD("rm -rf %s/%s" % (SRC_DIR, file))
+ for line in output:
+ if "Failure" in line:
+ action_status = False
+ break
+
+ # Do some special copy/delete... steps
+ '''
+ (return_code, output) = doRemoteCMD(
+ "mkdir -p %s/tests" % PKG_SRC_DIR)
+ if return_code != 0:
+ action_status = False
+
+ if not doRemoteCopy("specname/tests", "%s/tests" % PKG_SRC_DIR):
+ action_status = False
+ '''
+
+ return action_status
+
+
+def main():
+ try:
+ usage = "usage: inst.py -i"
+ opts_parser = OptionParser(usage=usage)
+ opts_parser.add_option(
+ "-m", dest="mode", action="store", help="Specify mode")
+ opts_parser.add_option(
+ "-s", dest="device", action="store", help="Specify device")
+ opts_parser.add_option(
+ "-i", dest="binstpkg", action="store_true", help="Install package")
+ opts_parser.add_option(
+ "-u", dest="buninstpkg", action="store_true", help="Uninstall package")
+ opts_parser.add_option(
+ "-a", dest="user", action="store", help="User name")
+ global PARAMETERS
+ (PARAMETERS, args) = opts_parser.parse_args()
+ except Exception, e:
+ print "Got wrong option: %s, exit ..." % e
+ sys.exit(1)
+
+ if not PARAMETERS.user:
+ PARAMETERS.user = "owner"
+ if not PARAMETERS.mode:
+ PARAMETERS.mode = "SDB"
+
+ if PARAMETERS.mode == "SDB":
+ if not PARAMETERS.device:
+ (return_code, output) = doCMD("sdb devices")
+ for line in output:
+ if str.find(line, "\tdevice") != -1:
+ PARAMETERS.device = line.split("\t")[0]
+ break
+ else:
+ PARAMETERS.mode = "SSH"
+
+ if not PARAMETERS.device:
+ print "No device provided"
+ sys.exit(1)
+
+ user_info = getUSERID()
+ re_code = user_info[0]
+ if re_code == 0 :
+ global XW_ENV
+ userid = user_info[1][0]
+ XW_ENV = "export DBUS_SESSION_BUS_ADDRESS=unix:path=/run/user/%s/dbus/user_bus_socket"%str(userid)
+ else:
+ print "[Error] cmd commands error : %s"%str(user_info[1])
+ sys.exit(1)
+ if PARAMETERS.binstpkg and PARAMETERS.buninstpkg:
+ print "-i and -u are conflict"
+ sys.exit(1)
+
+ if PARAMETERS.buninstpkg:
+ if not uninstPKGs():
+ sys.exit(1)
+ else:
+ if not instPKGs():
+ sys.exit(1)
+
+if __name__ == "__main__":
+ main()
+ sys.exit(0)
--- /dev/null
+{
+ "version": "3.0",
+ "name": "tct-flexiblebox-css3-tests",
+ "permissions": ["tabs", "unlimited_storage", "notifications", "http://*/*", "https://*/*"],
+ "description": "tct-flexiblebox-css3-tests",
+ "file_name": "manifest.json",
+ "app": {
+ "launch": {
+ "local_path": "index.html"
+ }
+ },
+ "icons": {
+ "128": "icon.png"
+ }
+}
--- /dev/null
+#!/usr/bin/env python
+#
+# Copyright (c) 2014 Intel Corporation.
+#
+# Redistribution and use in source and binary forms, with or without
+# modification, are permitted provided that the following conditions are met:
+#
+# * Redistributions of works must retain the original copyright notice, this
+# list of conditions and the following disclaimer.
+# * Redistributions in binary form must reproduce the original copyright
+# notice, this list of conditions and the following disclaimer in the
+# documentation and/or other materials provided with the distribution.
+# * Neither the name of Intel Corporation nor the names of its contributors
+# may be used to endorse or promote products derived from this work without
+# specific prior written permission.
+#
+# THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+# AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+# IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+# ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+# INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+# BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+# DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+# OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+# NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+# EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+#
+# Authors:
+# Fan, Yugang <yugang.fan@intel.com>
+
+import os
+import shutil
+import glob
+import time
+import sys
+import stat
+import random
+import json
+import logging
+import zipfile
+import signal
+import subprocess
+from optparse import OptionParser
+
+reload(sys)
+sys.setdefaultencoding('utf8')
+
+TOOL_VERSION = "v0.1"
+VERSION_FILE = "VERSION"
+DEFAULT_CMD_TIMEOUT = 600
+PKG_TYPES = ["apk", "xpk", "wgt", "apk-aio", "cordova-aio", "cordova", "embeddingapi"]
+PKG_MODES = ["shared", "embedded"]
+PKG_ARCHS = ["x86", "arm"]
+PKG_BLACK_LIST = []
+PKG_NAME = None
+BUILD_PARAMETERS = None
+BUILD_ROOT = None
+BUILD_ROOT_SRC = None
+BUILD_ROOT_SRC_PKG = None
+BUILD_ROOT_SRC_PKG_APP = None
+BUILD_ROOT_SRC_SUB_APP = None
+BUILD_ROOT_PKG = None
+BUILD_ROOT_PKG_APP = None
+LOG = None
+LOG_LEVEL = logging.DEBUG
+
+
+class ColorFormatter(logging.Formatter):
+
+ def __init__(self, msg):
+ logging.Formatter.__init__(self, msg)
+
+ def format(self, record):
+ red, green, yellow, blue = range(4)
+ colors = {'INFO': green, 'DEBUG': blue,
+ 'WARNING': yellow, 'ERROR': red}
+ msg = record.msg
+ if msg[0] == "+":
+ msg = "\33[01m" + msg[1:] + "\033[0m"
+ elif msg[0] == "=":
+ msg = "\33[07m" + msg + "\033[0m"
+ levelname = record.levelname
+ if levelname in colors:
+ msg_color = "\033[0;%dm" % (
+ 31 + colors[levelname]) + msg + "\033[0m"
+ record.msg = msg_color
+
+ return logging.Formatter.format(self, record)
+
+
+def pidExists(pid):
+ if pid < 0:
+ return False
+ try:
+ os.kill(pid, 0)
+ except OSError:
+ return False
+ else:
+ return True
+
+
+def isWindows():
+ return sys.platform == "cygwin" or sys.platform.startswith("win")
+
+
+def killProcesses(ppid=None):
+ if isWindows():
+ subprocess.check_call("TASKKILL /F /PID %s /T" % ppid)
+ else:
+ ppid = str(ppid)
+ pidgrp = []
+
+ def GetChildPids(ppid):
+ command = "ps -ef | awk '{if ($3 ==%s) print $2;}'" % str(ppid)
+ pids = os.popen(command).read()
+ pids = pids.split()
+ return pids
+
+ pidgrp.extend(GetChildPids(ppid))
+ for pid in pidgrp:
+ pidgrp.extend(GetChildPids(pid))
+
+ pidgrp.insert(0, ppid)
+ while len(pidgrp) > 0:
+ pid = pidgrp.pop()
+ try:
+ os.kill(int(pid), signal.SIGKILL)
+ return True
+ except OSError:
+ try:
+ os.popen("kill -9 %d" % int(pid))
+ return True
+ except Exception:
+ return False
+
+
+def safelyGetValue(origin_json=None, key=None):
+ if origin_json and key and key in origin_json:
+ return origin_json[key]
+ return None
+
+
+def checkContains(origin_str=None, key_str=None):
+ if origin_str.upper().find(key_str.upper()) >= 0:
+ return True
+ return False
+
+
+def getRandomStr():
+ str_pool = list("abcdefghijklmnopqrstuvwxyz1234567890")
+ random_str = ""
+ for i in range(15):
+ index = random.randint(0, len(str_pool) - 1)
+ random_str = random_str + str_pool[index]
+
+ return random_str
+
+
+def zipDir(dir_path, zip_file):
+ try:
+ if os.path.exists(zip_file):
+ if not doRemove([zip_file]):
+ return False
+ if not os.path.exists(os.path.dirname(zip_file)):
+ os.makedirs(os.path.dirname(zip_file))
+ z_file = zipfile.ZipFile(zip_file, "w")
+ orig_dir = os.getcwd()
+ os.chdir(dir_path)
+ for root, dirs, files in os.walk("."):
+ for i_file in files:
+ LOG.info("zip %s" % os.path.join(root, i_file))
+ z_file.write(os.path.join(root, i_file))
+ z_file.close()
+ os.chdir(orig_dir)
+ except Exception as e:
+ LOG.error("Fail to pack %s to %s: %s" % (dir_path, zip_file, e))
+ return False
+ LOG.info("Done to zip %s to %s" % (dir_path, zip_file))
+ return True
+
+
+def overwriteCopy(src, dest, symlinks=False, ignore=None):
+ if not os.path.exists(dest):
+ os.makedirs(dest)
+ shutil.copystat(src, dest)
+ sub_list = os.listdir(src)
+ if ignore:
+ excl = ignore(src, sub_list)
+ sub_list = [x for x in sub_list if x not in excl]
+ for i_sub in sub_list:
+ s_path = os.path.join(src, i_sub)
+ d_path = os.path.join(dest, i_sub)
+ if symlinks and os.path.islink(s_path):
+ if os.path.lexists(d_path):
+ os.remove(d_path)
+ os.symlink(os.readlink(s_path), d_path)
+ try:
+ s_path_s = os.lstat(s_path)
+ s_path_mode = stat.S_IMODE(s_path_s.st_mode)
+ os.lchmod(d_path, s_path_mode)
+ except Exception:
+ pass
+ elif os.path.isdir(s_path):
+ overwriteCopy(s_path, d_path, symlinks, ignore)
+ else:
+ shutil.copy2(s_path, d_path)
+
+
+def doCopy(src_item=None, dest_item=None):
+ LOG.info("Copying %s to %s" % (src_item, dest_item))
+ try:
+ if os.path.isdir(src_item):
+ overwriteCopy(src_item, dest_item, symlinks=True)
+ else:
+ if not os.path.exists(os.path.dirname(dest_item)):
+ LOG.info("Create non-existent dir: %s" %
+ os.path.dirname(dest_item))
+ os.makedirs(os.path.dirname(dest_item))
+ shutil.copy2(src_item, dest_item)
+ except Exception as e:
+ LOG.error("Fail to copy file %s: %s" % (src_item, e))
+ return False
+
+ return True
+
+
+def doRemove(target_file_list=None):
+ for i_file in target_file_list:
+ LOG.info("Removing %s" % i_file)
+ try:
+ if os.path.isdir(i_file):
+ shutil.rmtree(i_file)
+ else:
+ os.remove(i_file)
+ except Exception as e:
+ LOG.error("Fail to remove file %s: %s" % (i_file, e))
+ return False
+ return True
+
+
+def updateCopylistPrefix(src_default, dest_default, src_sub, dest_sub):
+ src_new = ""
+ dest_new = ""
+ PACK_TOOL_TAG = "PACK-TOOL-ROOT"
+
+ if src_sub[0:len(PACK_TOOL_TAG)] == PACK_TOOL_TAG:
+ src_new = src_sub.replace(PACK_TOOL_TAG, BUILD_PARAMETERS.pkgpacktools)
+ else:
+ src_new = os.path.join(src_default, src_sub)
+
+ if dest_sub[0:len(PACK_TOOL_TAG)] == PACK_TOOL_TAG:
+ dest_new = dest_sub.replace(PACK_TOOL_TAG, BUILD_ROOT)
+ else:
+ dest_new = os.path.join(dest_default, dest_sub)
+
+ return (src_new, dest_new)
+
+
+def buildSRC(src=None, dest=None, build_json=None):
+ if not os.path.exists(src):
+ LOG.info("+Src dir does not exist, skip build src process ...")
+ return True
+ if not doCopy(src, dest):
+ return False
+ if "blacklist" in build_json:
+ if build_json["blacklist"].count("") > 0:
+ build_json["blacklist"].remove("")
+ black_file_list = []
+ for i_black in build_json["blacklist"]:
+ black_file_list = black_file_list + \
+ glob.glob(os.path.join(dest, i_black))
+
+ black_file_list = list(set(black_file_list))
+ if not doRemove(black_file_list):
+ return False
+
+ if "copylist" in build_json:
+ for i_s_key in build_json["copylist"].keys():
+ if i_s_key and build_json["copylist"][i_s_key]:
+ (src_updated, dest_updated) = updateCopylistPrefix(
+ src, dest, i_s_key, build_json["copylist"][i_s_key])
+ if not doCopy(src_updated, dest_updated):
+ return False
+
+ return True
+
+
+def exitHandler(return_code=1):
+ LOG.info("+Cleaning build root folder ...")
+ if not BUILD_PARAMETERS.bnotclean and os.path.exists(BUILD_ROOT):
+ if not doRemove([BUILD_ROOT]):
+ LOG.error("Fail to clean build root, exit ...")
+ sys.exit(1)
+
+ if return_code == 0:
+ LOG.info("================ DONE ================")
+ else:
+ LOG.error(
+ "================ Found Something Wrong !!! ================")
+ sys.exit(return_code)
+
+
+def prepareBuildRoot():
+ LOG.info("+Preparing build root folder ...")
+ global BUILD_ROOT
+ global BUILD_ROOT_SRC
+ global BUILD_ROOT_SRC_PKG
+ global BUILD_ROOT_SRC_PKG_APP
+ global BUILD_ROOT_SRC_SUB_APP
+ global BUILD_ROOT_PKG
+ global BUILD_ROOT_PKG_APP
+
+ while True:
+ BUILD_ROOT = os.path.join("/tmp", getRandomStr())
+ if os.path.exists(BUILD_ROOT):
+ continue
+ else:
+ break
+
+ BUILD_ROOT_SRC = os.path.join(BUILD_ROOT, PKG_NAME)
+ BUILD_ROOT_SRC_PKG = os.path.join(BUILD_ROOT, "pkg")
+ BUILD_ROOT_SRC_PKG_APP = os.path.join(BUILD_ROOT, "pkg-app")
+ BUILD_ROOT_SRC_SUB_APP = os.path.join(BUILD_ROOT, "sub-app")
+ BUILD_ROOT_PKG = os.path.join(BUILD_ROOT, "pkg", "opt", PKG_NAME)
+ BUILD_ROOT_PKG_APP = os.path.join(BUILD_ROOT, "pkg-app", "opt", PKG_NAME)
+
+ if not doCopy(BUILD_PARAMETERS.srcdir, BUILD_ROOT_SRC):
+ return False
+ if not doRemove(
+ glob.glob(os.path.join(BUILD_ROOT_SRC, "%s*.zip" % PKG_NAME))):
+ return False
+
+ return True
+
+
+def doCMD(cmd, time_out=DEFAULT_CMD_TIMEOUT, no_check_return=False):
+ LOG.info("Doing CMD: [ %s ]" % cmd)
+ pre_time = time.time()
+ cmd_proc = subprocess.Popen(args=cmd, shell=True)
+ while True:
+ cmd_exit_code = cmd_proc.poll()
+ elapsed_time = time.time() - pre_time
+ if cmd_exit_code is None:
+ if elapsed_time >= time_out:
+ killProcesses(ppid=cmd_proc.pid)
+ LOG.error("Timeout to exe CMD")
+ return False
+ else:
+ if not no_check_return and cmd_exit_code != 0:
+ LOG.error("Fail to exe CMD")
+ return False
+ break
+ time.sleep(2)
+ return True
+
+
+def doCMDWithOutput(cmd, time_out=DEFAULT_CMD_TIMEOUT):
+ LOG.info("Doing CMD: [ %s ]" % cmd)
+ pre_time = time.time()
+ output = []
+ cmd_return_code = 1
+ cmd_proc = subprocess.Popen(
+ cmd, stdout=subprocess.PIPE, stderr=subprocess.STDOUT, shell=True)
+
+ while True:
+ output_line = cmd_proc.stdout.readline().strip("\r\n")
+ cmd_return_code = cmd_proc.poll()
+ elapsed_time = time.time() - pre_time
+ if cmd_return_code is None:
+ if elapsed_time >= time_out:
+ killProcesses(ppid=cmd_proc.pid)
+ LOG.error("Timeout to exe CMD")
+ return False
+ elif output_line == '' and cmd_return_code is not None:
+ break
+
+ sys.stdout.write("%s\n" % output_line)
+ sys.stdout.flush()
+ output.append(output_line)
+ if cmd_return_code != 0:
+ LOG.error("Fail to exe CMD")
+
+ return (cmd_return_code, output)
+
+
+def packXPK(build_json=None, app_src=None, app_dest=None, app_name=None):
+ pack_tool = os.path.join(BUILD_ROOT, "make_xpk.py")
+ if not os.path.exists(pack_tool):
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, "make_xpk.py"),
+ pack_tool):
+ return False
+ orig_dir = os.getcwd()
+ os.chdir(BUILD_ROOT)
+ if os.path.exists("key.file"):
+ if not doRemove(["key.file"]):
+ os.chdir(orig_dir)
+ return False
+
+ key_file = safelyGetValue(build_json, "key-file")
+ if key_file == "key.file":
+ LOG.error(
+ "\"key.file\" is reserved name for default key file, "
+ "pls change the key file name ...")
+ os.chdir(orig_dir)
+ return False
+ if key_file:
+ pack_cmd = "python make_xpk.py %s %s -o %s" % (
+ app_src, key_file, os.path.join(app_dest, "%s.xpk" % app_name))
+ else:
+ pack_cmd = "python make_xpk.py %s key.file -o %s" % (
+ app_src, os.path.join(app_dest, "%s.xpk" % app_name))
+ if not doCMD(pack_cmd, DEFAULT_CMD_TIMEOUT):
+ os.chdir(orig_dir)
+ return False
+
+ os.chdir(orig_dir)
+ return True
+
+
+def packWGT(build_json=None, app_src=None, app_dest=None, app_name=None):
+ if not zipDir(app_src, os.path.join(app_dest, "%s.wgt" % app_name)):
+ return False
+
+ if BUILD_PARAMETERS.signature == True:
+ if safelyGetValue(build_json, "sign-flag") == "true":
+ if not os.path.exists(os.path.join(BUILD_ROOT, "signing")):
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, "signing"),
+ os.path.join(BUILD_ROOT, "signing")):
+ return False
+ signing_cmd = "%s --dist platform %s" % (
+ os.path.join(BUILD_ROOT, "signing", "sign-widget.sh"),
+ os.path.join(app_dest, "%s.wgt" % app_name))
+ if not doCMD(signing_cmd, DEFAULT_CMD_TIMEOUT):
+ return False
+
+ return True
+
+
+def packAPK(build_json=None, app_src=None, app_dest=None, app_name=None):
+ app_name = app_name.replace("-", "_")
+
+ if not os.path.exists(os.path.join(BUILD_ROOT, "crosswalk")):
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, "crosswalk"),
+ os.path.join(BUILD_ROOT, "crosswalk")):
+ return False
+
+ files = glob.glob(os.path.join(BUILD_ROOT, "crosswalk", "*.apk"))
+ if files:
+ if not doRemove(files):
+ return False
+
+ ext_opt = ""
+ cmd_opt = ""
+ url_opt = ""
+ mode_opt = ""
+ arch_opt = ""
+ icon_opt = ""
+
+ common_opts = safelyGetValue(build_json, "apk-common-opts")
+ if common_opts is None:
+ common_opts = ""
+
+ tmp_opt = safelyGetValue(build_json, "apk-ext-opt")
+ if tmp_opt:
+ ext_opt = "--extensions='%s'" % os.path.join(BUILD_ROOT_SRC, tmp_opt)
+
+ tmp_opt = safelyGetValue(build_json, "apk-cmd-opt")
+ if tmp_opt:
+ cmd_opt = "--xwalk-command-line='%s'" % tmp_opt
+
+ tmp_opt = safelyGetValue(build_json, "apk-url-opt")
+ if tmp_opt:
+ url_opt = "--app-url='%s'" % tmp_opt
+
+ tmp_opt = safelyGetValue(build_json, "apk-mode-opt")
+ if tmp_opt:
+ if tmp_opt in PKG_MODES:
+ mode_opt = "--mode=%s" % tmp_opt
+ else:
+ LOG.error("Got wrong app mode: %s" % tmp_opt)
+ return False
+ else:
+ mode_opt = "--mode=%s" % BUILD_PARAMETERS.pkgmode
+
+ tmp_opt = safelyGetValue(build_json, "apk-arch-opt")
+ if tmp_opt:
+ if tmp_opt in PKG_ARCHS:
+ arch_opt = "--arch=%s" % tmp_opt
+ else:
+ LOG.error("Got wrong app arch: %s" % tmp_opt)
+ return False
+ else:
+ arch_opt = "--arch=%s" % BUILD_PARAMETERS.pkgarch
+
+ tmp_opt = safelyGetValue(build_json, "apk-icon-opt")
+ if tmp_opt:
+ icon_opt = "--icon=%s" % tmp_opt
+ elif tmp_opt == "":
+ icon_opt = ""
+ else:
+ icon_opt = "--icon=%s/icon.png" % app_src
+
+ if safelyGetValue(build_json, "apk-type") == "MANIFEST":
+ pack_cmd = "python make_apk.py --package=org.xwalk.%s " \
+ "--manifest=%s/manifest.json %s %s %s %s %s" % (
+ app_name, app_src, mode_opt, arch_opt,
+ ext_opt, cmd_opt, common_opts)
+ elif safelyGetValue(build_json, "apk-type") == "HOSTEDAPP":
+ if not url_opt:
+ LOG.error(
+ "Fail to find the key \"apk-url-opt\" for hosted APP packing")
+ return False
+ pack_cmd = "python make_apk.py --package=org.xwalk.%s --name=%s %s " \
+ "%s %s %s %s %s" % (
+ app_name, app_name, mode_opt, arch_opt, ext_opt,
+ cmd_opt, url_opt, common_opts)
+ else:
+ pack_cmd = "python make_apk.py --package=org.xwalk.%s --name=%s " \
+ "--app-root=%s --app-local-path=index.html %s %s " \
+ "%s %s %s %s" % (
+ app_name, app_name, app_src, icon_opt, mode_opt,
+ arch_opt, ext_opt, cmd_opt, common_opts)
+
+ orig_dir = os.getcwd()
+ os.chdir(os.path.join(BUILD_ROOT, "crosswalk"))
+ if not doCMD(pack_cmd, DEFAULT_CMD_TIMEOUT):
+ os.chdir(orig_dir)
+ return False
+
+ files = glob.glob(os.path.join(BUILD_ROOT, "crosswalk", "*.apk"))
+ if files:
+ if not doCopy(files[0], os.path.join(app_dest, "%s.apk" % app_name)):
+ os.chdir(orig_dir)
+ return False
+ else:
+ LOG.error("Fail to find the apk file")
+ os.chdir(orig_dir)
+ return False
+
+ os.chdir(orig_dir)
+ return True
+
+
+def packCordova(build_json=None, app_src=None, app_dest=None, app_name=None):
+ pack_tool = os.path.join(BUILD_ROOT, "cordova")
+ app_name = app_name.replace("-", "_")
+ if not os.path.exists(pack_tool):
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, "cordova"),
+ pack_tool):
+ return False
+
+ plugin_tool = os.path.join(BUILD_ROOT, "cordova_plugins")
+ if not os.path.exists(plugin_tool):
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, "cordova_plugins"),
+ plugin_tool):
+ return False
+
+ orig_dir = os.getcwd()
+ os.chdir(pack_tool)
+ pack_cmd = "bin/create %s org.xwalk.%s %s" % (
+ app_name, app_name, app_name)
+ if not doCMD(pack_cmd, DEFAULT_CMD_TIMEOUT):
+ os.chdir(orig_dir)
+ return False
+
+ os.chdir(os.path.join(pack_tool, app_name))
+ plugin_dirs = os.listdir(plugin_tool)
+ for i_dir in plugin_dirs:
+ i_plugin_dir = os.path.join(plugin_tool, i_dir)
+ plugin_install_cmd = "plugman install --platform android --project " \
+ "./ --plugin %s" % i_plugin_dir
+ if not doCMD(plugin_install_cmd, DEFAULT_CMD_TIMEOUT):
+ os.chdir(orig_dir)
+ return False
+ os.chdir(pack_tool)
+
+ if not doCopy(app_src, os.path.join(pack_tool, app_name, "assets", "www")):
+ os.chdir(orig_dir)
+ return False
+ os.chdir(os.path.join(BUILD_ROOT, "cordova", app_name))
+ pack_cmd = "./cordova/build"
+ if not doCMD(pack_cmd, DEFAULT_CMD_TIMEOUT):
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(os.path.join(
+ BUILD_ROOT, "cordova", app_name, "bin", "%s-debug.apk" %
+ app_name),
+ os.path.join(app_dest, "%s.apk" % app_name)):
+ os.chdir(orig_dir)
+ return False
+ os.chdir(orig_dir)
+ return True
+
+
+def packEmbeddingAPI(
+ build_json=None, app_src=None, app_dest=None, app_name=None):
+ app_name = app_name.replace("-", "_")
+
+ library_dir_name = safelyGetValue(build_json, "embeddingapi-library-name")
+ if not library_dir_name:
+ LOG.error("Fail to get embeddingapi-library-name ...")
+ return False
+
+ new_library_dir_name = "core_library"
+ pack_tool = os.path.join(app_src, "..", new_library_dir_name)
+
+ if os.path.exists(pack_tool):
+ if not doRemove([pack_tool]):
+ return False
+
+ if not doCopy(
+ os.path.join(BUILD_PARAMETERS.pkgpacktools, library_dir_name),
+ pack_tool):
+ return False
+
+ if os.path.exists(os.path.join(pack_tool, "bin", "res", "crunch")):
+ if not doRemove([os.path.join(pack_tool, "bin", "res", "crunch")]):
+ return False
+
+ orig_dir = os.getcwd()
+ android_project_path = os.path.join(app_src, "android-project")
+ try:
+ os.makedirs(android_project_path)
+ except Exception as e:
+ LOG.error("Fail to create tmp project dir: %s" % e)
+ return False
+
+ (return_code, output) = doCMDWithOutput("android list target")
+ api_level = ""
+ for line in output:
+ if "API level" in line:
+ api_level = line.split(":")[1].strip()
+ break
+ if not api_level:
+ LOG.error("Fail to get Android API Level")
+ os.chdir(orig_dir)
+ return False
+
+ android_project_cmd = "android create project --name %s --target " \
+ "android-%s --path %s --package com.%s " \
+ "--activity MainActivity" % (
+ app_name, api_level, android_project_path, app_name)
+ if not doCMD(android_project_cmd):
+ os.chdir(orig_dir)
+ return False
+
+ try:
+ update_file = open(
+ os.path.join(android_project_path, "project.properties"), "a+")
+ update_file.writelines(
+ "{0}\n".format(
+ "android.library.reference.1=../%s" %
+ new_library_dir_name))
+ update_file.close()
+ except Exception as e:
+ LOG.error(
+ "Fail to update %s: %s" %
+ (os.path.join(
+ android_project_path,
+ "project.properties"),
+ e))
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(os.path.join(android_project_path, "build.xml"),
+ os.path.join(app_src, "build.xml")):
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(
+ os.path.join(android_project_path, "project.properties"),
+ os.path.join(app_src, "project.properties")):
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(
+ os.path.join(android_project_path, "local.properties"),
+ os.path.join(app_src, "local.properties")):
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(
+ os.path.join(android_project_path, "local.properties"),
+ os.path.join(pack_tool, "local.properties")):
+ os.chdir(orig_dir)
+ return False
+
+ os.chdir(app_src)
+ if not doCMD("ant debug"):
+ os.chdir(orig_dir)
+ return False
+
+ if not doCopy(
+ os.path.join(app_src, "bin", "%s-debug.apk" % app_name),
+ os.path.join(app_dest, "%s.apk" % app_name)):
+ os.chdir(orig_dir)
+ return False
+ os.chdir(orig_dir)
+ return True
+
+
+def packAPP(build_json=None, app_src=None, app_dest=None, app_name=None):
+ LOG.info("Packing %s(%s)" % (app_name, app_src))
+ if not os.path.exists(app_dest):
+ try:
+ os.makedirs(app_dest)
+ except Exception as e:
+ LOG.error("Fail to init package install dest dir: %s" % e)
+ return False
+
+ if checkContains(BUILD_PARAMETERS.pkgtype, "XPK"):
+ if not packXPK(build_json, app_src, app_dest, app_name):
+ return False
+ elif checkContains(BUILD_PARAMETERS.pkgtype, "WGT"):
+ if not packWGT(build_json, app_src, app_dest, app_name):
+ return False
+ elif checkContains(BUILD_PARAMETERS.pkgtype, "APK"):
+ if not packAPK(build_json, app_src, app_dest, app_name):
+ return False
+ elif checkContains(BUILD_PARAMETERS.pkgtype, "CORDOVA"):
+ if not packCordova(build_json, app_src, app_dest, app_name):
+ return False
+ elif checkContains(BUILD_PARAMETERS.pkgtype, "EMBEDDINGAPI"):
+ if not packEmbeddingAPI(build_json, app_src, app_dest, app_name):
+ return False
+ else:
+ LOG.error("Got wrong pkg type: %s" % BUILD_PARAMETERS.pkgtype)
+ return False
+
+ LOG.info("Success to pack APP: %s" % app_name)
+ return True
+
+
+def createIndexFile(index_file_path=None, hosted_app=None):
+ try:
+ if hosted_app:
+ index_url = "http://127.0.0.1/opt/%s/webrunner/index.html?" \
+ "testsuite=../tests.xml&testprefix=../../.." % PKG_NAME
+ else:
+ index_url = "opt/%s/webrunner/index.html?testsuite=../tests.xml" \
+ "&testprefix=../../.." % PKG_NAME
+ html_content = "<!doctype html><head><meta http-equiv='Refresh' " \
+ "content='1; url=%s'></head>" % index_url
+ index_file = open(index_file_path, "w")
+ index_file.write(html_content)
+ index_file.close()
+ except Exception as e:
+ LOG.error("Fail to create index.html for top-app: %s" % e)
+ return False
+ LOG.info("Success to create index file %s" % index_file_path)
+ return True
+
+
+def buildSubAPP(app_dir=None, build_json=None, app_dest_default=None):
+ app_dir_inside = safelyGetValue(build_json, "app-dir")
+ if app_dir_inside:
+ app_dir = app_dir_inside
+ LOG.info("+Building sub APP(s) from %s ..." % app_dir)
+ app_dir = os.path.join(BUILD_ROOT_SRC, app_dir)
+ app_name = safelyGetValue(build_json, "app-name")
+ if not app_name:
+ app_name = os.path.basename(app_dir)
+
+ app_src = os.path.join(BUILD_ROOT_SRC_SUB_APP, app_name)
+ if buildSRC(app_dir, app_src, build_json):
+ app_dest = safelyGetValue(build_json, "install-path")
+ if app_dest:
+ app_dest = os.path.join(app_dest_default, app_dest)
+ else:
+ app_dest = app_dest_default
+
+ if safelyGetValue(build_json, "all-apps") == "true":
+ app_dirs = os.listdir(app_src)
+ apps_num = 0
+ for i_app_dir in app_dirs:
+ if os.path.isdir(os.path.join(app_src, i_app_dir)):
+ i_app_name = os.path.basename(i_app_dir)
+ if not packAPP(
+ build_json, os.path.join(app_src, i_app_name),
+ app_dest, i_app_name):
+ return False
+ else:
+ apps_num = apps_num + 1
+ if apps_num > 0:
+ LOG.info("Totally packed %d apps in %s" % (apps_num, app_dir))
+ return True
+ else:
+ return packAPP(build_json, app_src, app_dest, app_name)
+ return False
+
+
+def buildPKGAPP(build_json=None):
+ LOG.info("+Building package APP ...")
+ if not doCopy(os.path.join(BUILD_ROOT_SRC, "icon.png"),
+ os.path.join(BUILD_ROOT_SRC_PKG_APP, "icon.png")):
+ return False
+
+ if checkContains(BUILD_PARAMETERS.pkgtype, "XPK"):
+ if not doCopy(
+ os.path.join(BUILD_ROOT_SRC, "manifest.json"),
+ os.path.join(BUILD_ROOT_SRC_PKG_APP, "manifest.json")):
+ return False
+ elif checkContains(BUILD_PARAMETERS.pkgtype, "WGT"):
+ if not doCopy(os.path.join(BUILD_ROOT_SRC, "config.xml"),
+ os.path.join(BUILD_ROOT_SRC_PKG_APP, "config.xml")):
+ return False
+
+ hosted_app = False
+ if safelyGetValue(build_json, "hosted-app") == "true":
+ hosted_app = True
+ if not createIndexFile(
+ os.path.join(BUILD_ROOT_SRC_PKG_APP, "index.html"), hosted_app):
+ return False
+
+ if not hosted_app:
+ if "blacklist" not in build_json:
+ build_json.update({"blacklist": []})
+ build_json["blacklist"].extend(PKG_BLACK_LIST)
+ if not buildSRC(BUILD_ROOT_SRC, BUILD_ROOT_PKG_APP, build_json):
+ return False
+
+ if "subapp-list" in build_json:
+ for i_sub_app in build_json["subapp-list"].keys():
+ if not buildSubAPP(
+ i_sub_app, build_json["subapp-list"][i_sub_app],
+ BUILD_ROOT_PKG_APP):
+ return False
+
+ if not packAPP(
+ build_json, BUILD_ROOT_SRC_PKG_APP, BUILD_ROOT_PKG, PKG_NAME):
+ return False
+
+ return True
+
+
+def buildPKG(build_json=None):
+ if "blacklist" not in build_json:
+ build_json.update({"blacklist": []})
+ build_json["blacklist"].extend(PKG_BLACK_LIST)
+ if not buildSRC(BUILD_ROOT_SRC, BUILD_ROOT_PKG, build_json):
+ return False
+
+ if "subapp-list" in build_json:
+ for i_sub_app in build_json["subapp-list"].keys():
+ if not buildSubAPP(
+ i_sub_app, build_json["subapp-list"][i_sub_app],
+ BUILD_ROOT_PKG):
+ return False
+
+ if "pkg-app" in build_json:
+ if not buildPKGAPP(build_json["pkg-app"]):
+ return False
+
+ return True
+
+
+def main():
+ global LOG
+ LOG = logging.getLogger("pack-tool")
+ LOG.setLevel(LOG_LEVEL)
+ stream_handler = logging.StreamHandler()
+ stream_handler.setLevel(LOG_LEVEL)
+ stream_formatter = ColorFormatter("[%(asctime)s] %(message)s")
+ stream_handler.setFormatter(stream_formatter)
+ LOG.addHandler(stream_handler)
+
+ try:
+ usage = "Usage: ./pack.py -t apk -m shared -a x86"
+ opts_parser = OptionParser(usage=usage)
+ opts_parser.add_option(
+ "-c",
+ "--cfg",
+ dest="pkgcfg",
+ help="specify the path of config json file")
+ opts_parser.add_option(
+ "-t",
+ "--type",
+ dest="pkgtype",
+ help="specify the pkg type, e.g. apk, xpk, wgt ...")
+ opts_parser.add_option(
+ "-m",
+ "--mode",
+ dest="pkgmode",
+ help="specify the apk mode, e.g. shared, embedded")
+ opts_parser.add_option(
+ "-a",
+ "--arch",
+ dest="pkgarch",
+ help="specify the apk arch, e.g. x86, arm")
+ opts_parser.add_option(
+ "-d",
+ "--dest",
+ dest="destdir",
+ help="specify the installation folder for packed package")
+ opts_parser.add_option(
+ "-s",
+ "--src",
+ dest="srcdir",
+ help="specify the path of pkg resource for packing")
+ opts_parser.add_option(
+ "--tools",
+ dest="pkgpacktools",
+ help="specify the parent folder of pack tools")
+ opts_parser.add_option(
+ "--notclean",
+ dest="bnotclean",
+ action="store_true",
+ help="disable the build root clean after the packing")
+ opts_parser.add_option(
+ "--sign",
+ dest="signature",
+ action="store_true",
+ help="signature operation will be done when packing wgt")
+ opts_parser.add_option(
+ "-v",
+ "--version",
+ dest="bversion",
+ action="store_true",
+ help="show this tool's version")
+ opts_parser.add_option(
+ "--pkg-version",
+ dest="pkgversion",
+ help="specify the pkg version, e.g. 0.0.0.1")
+
+ if len(sys.argv) == 1:
+ sys.argv.append("-h")
+
+ global BUILD_PARAMETERS
+ (BUILD_PARAMETERS, args) = opts_parser.parse_args()
+ except Exception as e:
+ LOG.error("Got wrong options: %s, exit ..." % e)
+ sys.exit(1)
+
+ if BUILD_PARAMETERS.bversion:
+ print "Version: %s" % TOOL_VERSION
+ sys.exit(0)
+
+ if not BUILD_PARAMETERS.srcdir:
+ BUILD_PARAMETERS.srcdir = os.getcwd()
+ BUILD_PARAMETERS.srcdir = os.path.expanduser(BUILD_PARAMETERS.srcdir)
+
+ if not os.path.exists(
+ os.path.join(BUILD_PARAMETERS.srcdir, "..", "..", VERSION_FILE)):
+ if not os.path.exists(
+ os.path.join(BUILD_PARAMETERS.srcdir, "..", VERSION_FILE)):
+ if not os.path.exists(
+ os.path.join(BUILD_PARAMETERS.srcdir, VERSION_FILE)):
+ LOG.info(
+ "Not found pkg version file, try to use option --pkg-version")
+ pkg_version_file_path = None
+ else:
+ pkg_version_file_path = os.path.join(
+ BUILD_PARAMETERS.srcdir, VERSION_FILE)
+ else:
+ pkg_version_file_path = os.path.join(
+ BUILD_PARAMETERS.srcdir, "..", VERSION_FILE)
+ else:
+ pkg_version_file_path = os.path.join(
+ BUILD_PARAMETERS.srcdir, "..", "..", VERSION_FILE)
+
+ try:
+ pkg_main_version = 0
+ pkg_release_version = 0
+ if BUILD_PARAMETERS.pkgversion:
+ LOG.info("Using %s as pkg version " % BUILD_PARAMETERS.pkgversion)
+ pkg_main_version = BUILD_PARAMETERS.pkgversion
+ else:
+ if pkg_version_file_path is not None:
+ LOG.info("Using pkg version file: %s" % pkg_version_file_path)
+ with open(pkg_version_file_path, "rt") as pkg_version_file:
+ pkg_version_raw = pkg_version_file.read()
+ pkg_version_file.close()
+ pkg_version_json = json.loads(pkg_version_raw)
+ pkg_main_version = pkg_version_json["main-version"]
+ pkg_release_version = pkg_version_json["release-version"]
+ except Exception as e:
+ LOG.error("Fail to read pkg version file: %s, exit ..." % e)
+ sys.exit(1)
+
+ if not BUILD_PARAMETERS.pkgtype:
+ LOG.error("No pkg type provided, exit ...")
+ sys.exit(1)
+ elif not BUILD_PARAMETERS.pkgtype in PKG_TYPES:
+ LOG.error("Wrong pkg type, only support: %s, exit ..." %
+ PKG_TYPES)
+ sys.exit(1)
+
+ if BUILD_PARAMETERS.pkgtype == "apk" or \
+ BUILD_PARAMETERS.pkgtype == "apk-aio":
+ if not BUILD_PARAMETERS.pkgmode:
+ LOG.error("No pkg mode option provided, exit ...")
+ sys.exit(1)
+ elif not BUILD_PARAMETERS.pkgmode in PKG_MODES:
+ LOG.error(
+ "Wrong pkg mode option provided, only support:%s, exit ..." %
+ PKG_MODES)
+ sys.exit(1)
+
+ if not BUILD_PARAMETERS.pkgarch:
+ LOG.error("No pkg arch option provided, exit ...")
+ sys.exit(1)
+ elif not BUILD_PARAMETERS.pkgarch in PKG_ARCHS:
+ LOG.error(
+ "Wrong pkg arch option provided, only support:%s, exit ..." %
+ PKG_ARCHS)
+ sys.exit(1)
+
+ if BUILD_PARAMETERS.pkgtype == "apk-aio" or \
+ BUILD_PARAMETERS.pkgtype == "cordova-aio":
+ if not BUILD_PARAMETERS.destdir or not os.path.exists(
+ BUILD_PARAMETERS.destdir):
+ LOG.error("No all-in-one installation dest dir found, exit ...")
+ sys.exit(1)
+
+ elif not BUILD_PARAMETERS.destdir:
+ BUILD_PARAMETERS.destdir = BUILD_PARAMETERS.srcdir
+ BUILD_PARAMETERS.destdir = os.path.expanduser(BUILD_PARAMETERS.destdir)
+
+ if not BUILD_PARAMETERS.pkgpacktools:
+ BUILD_PARAMETERS.pkgpacktools = os.path.join(
+ BUILD_PARAMETERS.srcdir, "..", "..", "tools")
+ BUILD_PARAMETERS.pkgpacktools = os.path.expanduser(
+ BUILD_PARAMETERS.pkgpacktools)
+
+ config_json = None
+ if BUILD_PARAMETERS.pkgcfg:
+ config_json_file_path = BUILD_PARAMETERS.pkgcfg
+ else:
+ config_json_file_path = os.path.join(
+ BUILD_PARAMETERS.srcdir, "suite.json")
+ try:
+ LOG.info("Using config json file: %s" % config_json_file_path)
+ with open(config_json_file_path, "rt") as config_json_file:
+ config_raw = config_json_file.read()
+ config_json_file.close()
+ config_json = json.loads(config_raw)
+ except Exception as e:
+ LOG.error("Fail to read config json file: %s, exit ..." % e)
+ sys.exit(1)
+
+ global PKG_NAME
+ PKG_NAME = safelyGetValue(config_json, "pkg-name")
+ if not PKG_NAME:
+ PKG_NAME = os.path.basename(BUILD_PARAMETERS.srcdir)
+ LOG.warning(
+ "Fail to read pkg name from json, "
+ "using src dir name as pkg name ...")
+
+ LOG.info("================= %s (%s-%s) ================" %
+ (PKG_NAME, pkg_main_version, pkg_release_version))
+
+ if not safelyGetValue(config_json, "pkg-list"):
+ LOG.error("Fail to read pkg-list, exit ...")
+ sys.exit(1)
+
+ pkg_json = None
+ for i_pkg in config_json["pkg-list"].keys():
+ i_pkg_list = i_pkg.replace(" ", "").split(",")
+ if BUILD_PARAMETERS.pkgtype in i_pkg_list:
+ pkg_json = config_json["pkg-list"][i_pkg]
+
+ if not pkg_json:
+ LOG.error("Fail to read pkg json, exit ...")
+ sys.exit(1)
+
+ if not prepareBuildRoot():
+ exitHandler(1)
+
+ if "pkg-blacklist" in config_json:
+ PKG_BLACK_LIST.extend(config_json["pkg-blacklist"])
+
+ if not buildPKG(pkg_json):
+ exitHandler(1)
+
+ LOG.info("+Building package ...")
+ if BUILD_PARAMETERS.pkgtype == "apk-aio" or \
+ BUILD_PARAMETERS.pkgtype == "cordova-aio":
+ pkg_file_list = os.listdir(os.path.join(BUILD_ROOT, "pkg"))
+ for i_file in pkg_file_list:
+ if not doCopy(
+ os.path.join(BUILD_ROOT, "pkg", i_file),
+ os.path.join(BUILD_PARAMETERS.destdir, i_file)):
+ exitHandler(1)
+ else:
+ pkg_file = os.path.join(
+ BUILD_PARAMETERS.destdir,
+ "%s-%s.%s.zip" %
+ (PKG_NAME,
+ pkg_main_version,
+ pkg_release_version))
+
+
+ if not zipDir(os.path.join(BUILD_ROOT, "pkg"), pkg_file):
+ exitHandler(1)
+
+if __name__ == "__main__":
+ main()
+ exitHandler(0)
--- /dev/null
+The testharness files come from
+https://github.com/w3c/testharness.js (commit 2486f01bf4c58de1c1b7cb39322af7b55c6c700b)
+without any modification.
+
+These tests are copyright by W3C and/or the author listed in the test
+file. The tests are dual-licensed under the W3C Test Suite License:
+http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
+and the BSD 3-clause License:
+http://www.w3.org/Consortium/Legal/2008/03-bsd-license
+under W3C's test suite licensing policy:
+http://www.w3.org/Consortium/Legal/2008/04-testsuite-copyright
+
--- /dev/null
+html {
+ font-family:DejaVu Sans, Bitstream Vera Sans, Arial, Sans;
+}
+
+#log .warning,
+#log .warning a {
+ color: black;
+ background: yellow;
+}
+
+#log .error,
+#log .error a {
+ color: white;
+ background: red;
+}
+
+#log pre {
+ border: 1px solid black;
+ padding: 1em;
+}
+
+section#summary {
+ margin-bottom:1em;
+}
+
+table#results {
+ border-collapse:collapse;
+ table-layout:fixed;
+ width:100%;
+}
+
+table#results th:first-child,
+table#results td:first-child {
+ width:4em;
+}
+
+table#results th:last-child,
+table#results td:last-child {
+ width:50%;
+}
+
+table#results.assertions th:last-child,
+table#results.assertions td:last-child {
+ width:35%;
+}
+
+table#results th {
+ padding:0;
+ padding-bottom:0.5em;
+ border-bottom:medium solid black;
+}
+
+table#results td {
+ padding:1em;
+ padding-bottom:0.5em;
+ border-bottom:thin solid black;
+}
+
+tr.pass > td:first-child {
+ color:green;
+}
+
+tr.fail > td:first-child {
+ color:red;
+}
+
+tr.timeout > td:first-child {
+ color:red;
+}
+
+tr.notrun > td:first-child {
+ color:blue;
+}
+
+.pass > td:first-child, .fail > td:first-child, .timeout > td:first-child, .notrun > td:first-child {
+ font-variant:small-caps;
+}
+
+table#results span {
+ display:block;
+}
+
+table#results span.expected {
+ font-family:DejaVu Sans Mono, Bitstream Vera Sans Mono, Monospace;
+ white-space:pre;
+}
+
+table#results span.actual {
+ font-family:DejaVu Sans Mono, Bitstream Vera Sans Mono, Monospace;
+ white-space:pre;
+}
+
+span.ok {
+ color:green;
+}
+
+tr.error {
+ color:red;
+}
+
+span.timeout {
+ color:red;
+}
+
+span.ok, span.timeout, span.error {
+ font-variant:small-caps;
+}
\ No newline at end of file
--- /dev/null
+/*global self*/
+/*jshint latedef: nofunc*/
+/*
+Distributed under both the W3C Test Suite License [1] and the W3C
+3-clause BSD License [2]. To contribute to a W3C Test Suite, see the
+policies and contribution forms [3].
+
+[1] http://www.w3.org/Consortium/Legal/2008/04-testsuite-license
+[2] http://www.w3.org/Consortium/Legal/2008/03-bsd-license
+[3] http://www.w3.org/2004/10/27-testcases
+*/
+
+/* Documentation is in docs/api.md */
+
+(function ()
+{
+ var debug = false;
+ // default timeout is 10 seconds, test can override if needed
+ var settings = {
+ output:true,
+ harness_timeout:{
+ "normal":10000,
+ "long":60000
+ },
+ test_timeout:null
+ };
+
+ var xhtml_ns = "http://www.w3.org/1999/xhtml";
+
+ /*
+ * TestEnvironment is an abstraction for the environment in which the test
+ * harness is used. Each implementation of a test environment has to provide
+ * the following interface:
+ *
+ * interface TestEnvironment {
+ * // Invoked after the global 'tests' object has been created and it's
+ * // safe to call add_*_callback() to register event handlers.
+ * void on_tests_ready();
+ *
+ * // Invoked after setup() has been called to notify the test environment
+ * // of changes to the test harness properties.
+ * void on_new_harness_properties(object properties);
+ *
+ * // Should return a new unique default test name.
+ * DOMString next_default_test_name();
+ *
+ * // Should return the test harness timeout duration in milliseconds.
+ * float test_timeout();
+ *
+ * // Should return the global scope object.
+ * object global_scope();
+ * };
+ */
+
+ /*
+ * A test environment with a DOM. The global object is 'window'. By default
+ * test results are displayed in a table. Any parent windows receive
+ * callbacks or messages via postMessage() when test events occur. See
+ * apisample11.html and apisample12.html.
+ */
+ function WindowTestEnvironment() {
+ this.name_counter = 0;
+ this.window_cache = null;
+ this.output_handler = null;
+ this.all_loaded = false;
+ var this_obj = this;
+ on_event(window, 'load', function() {
+ this_obj.all_loaded = true;
+ });
+ }
+
+ WindowTestEnvironment.prototype._dispatch = function(selector, callback_args, message_arg) {
+ this._forEach_windows(
+ function(w, is_same_origin) {
+ if (is_same_origin && selector in w) {
+ try {
+ w[selector].apply(undefined, callback_args);
+ } catch (e) {
+ if (debug) {
+ throw e;
+ }
+ }
+ }
+ if (supports_post_message(w) && w !== self) {
+ w.postMessage(message_arg, "*");
+ }
+ });
+ };
+
+ WindowTestEnvironment.prototype._forEach_windows = function(callback) {
+ // Iterate of the the windows [self ... top, opener]. The callback is passed
+ // two objects, the first one is the windows object itself, the second one
+ // is a boolean indicating whether or not its on the same origin as the
+ // current window.
+ var cache = this.window_cache;
+ if (!cache) {
+ cache = [[self, true]];
+ var w = self;
+ var i = 0;
+ var so;
+ var origins = location.ancestorOrigins;
+ while (w != w.parent) {
+ w = w.parent;
+ // In WebKit, calls to parent windows' properties that aren't on the same
+ // origin cause an error message to be displayed in the error console but
+ // don't throw an exception. This is a deviation from the current HTML5
+ // spec. See: https://bugs.webkit.org/show_bug.cgi?id=43504
+ // The problem with WebKit's behavior is that it pollutes the error console
+ // with error messages that can't be caught.
+ //
+ // This issue can be mitigated by relying on the (for now) proprietary
+ // `location.ancestorOrigins` property which returns an ordered list of
+ // the origins of enclosing windows. See:
+ // http://trac.webkit.org/changeset/113945.
+ if (origins) {
+ so = (location.origin == origins[i]);
+ } else {
+ so = is_same_origin(w);
+ }
+ cache.push([w, so]);
+ i++;
+ }
+ w = window.opener;
+ if (w) {
+ // window.opener isn't included in the `location.ancestorOrigins` prop.
+ // We'll just have to deal with a simple check and an error msg on WebKit
+ // browsers in this case.
+ cache.push([w, is_same_origin(w)]);
+ }
+ this.window_cache = cache;
+ }
+
+ forEach(cache,
+ function(a) {
+ callback.apply(null, a);
+ });
+ };
+
+ WindowTestEnvironment.prototype.on_tests_ready = function() {
+ var output = new Output();
+ this.output_handler = output;
+
+ var this_obj = this;
+ add_start_callback(function (properties) {
+ this_obj.output_handler.init(properties);
+ this_obj._dispatch("start_callback", [properties],
+ { type: "start", properties: properties });
+ });
+ add_test_state_callback(function(test) {
+ this_obj.output_handler.show_status();
+ this_obj._dispatch("test_state_callback", [test],
+ { type: "test_state", test: test.structured_clone() });
+ });
+ add_result_callback(function (test) {
+ this_obj.output_handler.show_status();
+ this_obj._dispatch("result_callback", [test],
+ { type: "result", test: test.structured_clone() });
+ });
+ add_completion_callback(function (tests, harness_status) {
+ this_obj.output_handler.show_results(tests, harness_status);
+ var cloned_tests = map(tests, function(test) { return test.structured_clone(); });
+ this_obj._dispatch("completion_callback", [tests, harness_status],
+ { type: "complete", tests: cloned_tests,
+ status: harness_status.structured_clone() });
+ });
+ };
+
+ WindowTestEnvironment.prototype.next_default_test_name = function() {
+ //Don't use document.title to work around an Opera bug in XHTML documents
+ var title = document.getElementsByTagName("title")[0];
+ var prefix = (title && title.firstChild && title.firstChild.data) || "Untitled";
+ var suffix = this.name_counter > 0 ? " " + this.name_counter : "";
+ this.name_counter++;
+ return prefix + suffix;
+ };
+
+ WindowTestEnvironment.prototype.on_new_harness_properties = function(properties) {
+ this.output_handler.setup(properties);
+ };
+
+ WindowTestEnvironment.prototype.add_on_loaded_callback = function(callback) {
+ on_event(window, 'load', callback);
+ };
+
+ WindowTestEnvironment.prototype.test_timeout = function() {
+ var metas = document.getElementsByTagName("meta");
+ for (var i = 0; i < metas.length; i++) {
+ if (metas[i].name == "timeout") {
+ if (metas[i].content == "long") {
+ return settings.harness_timeout.long;
+ }
+ break;
+ }
+ }
+ return settings.harness_timeout.normal;
+ };
+
+ WindowTestEnvironment.prototype.global_scope = function() {
+ return window;
+ };
+
+ /*
+ * Base TestEnvironment implementation for a generic web worker.
+ *
+ * Workers accumulate test results. One or more clients can connect and
+ * retrieve results from a worker at any time.
+ *
+ * WorkerTestEnvironment supports communicating with a client via a
+ * MessagePort. The mechanism for determining the appropriate MessagePort
+ * for communicating with a client depends on the type of worker and is
+ * implemented by the various specializations of WorkerTestEnvironment
+ * below.
+ *
+ * A client document using testharness can use fetch_tests_from_worker() to
+ * retrieve results from a worker. See apisample16.html.
+ */
+ function WorkerTestEnvironment() {
+ this.name_counter = 0;
+ this.all_loaded = true;
+ this.message_list = [];
+ this.message_ports = [];
+ }
+
+ WorkerTestEnvironment.prototype._dispatch = function(message) {
+ this.message_list.push(message);
+ for (var i = 0; i < this.message_ports.length; ++i)
+ {
+ this.message_ports[i].postMessage(message);
+ }
+ };
+
+ // The only requirement is that port has a postMessage() method. It doesn't
+ // have to be an instance of a MessagePort, and often isn't.
+ WorkerTestEnvironment.prototype._add_message_port = function(port) {
+ this.message_ports.push(port);
+ for (var i = 0; i < this.message_list.length; ++i)
+ {
+ port.postMessage(this.message_list[i]);
+ }
+ };
+
+ WorkerTestEnvironment.prototype.next_default_test_name = function() {
+ var suffix = this.name_counter > 0 ? " " + this.name_counter : "";
+ this.name_counter++;
+ return "Untitled" + suffix;
+ };
+
+ WorkerTestEnvironment.prototype.on_new_harness_properties = function() {};
+
+ WorkerTestEnvironment.prototype.on_tests_ready = function() {
+ var this_obj = this;
+ add_start_callback(
+ function(properties) {
+ this_obj._dispatch({
+ type: "start",
+ properties: properties,
+ });
+ });
+ add_test_state_callback(
+ function(test) {
+ this_obj._dispatch({
+ type: "test_state",
+ test: test.structured_clone()
+ });
+ });
+ add_result_callback(
+ function(test) {
+ this_obj._dispatch({
+ type: "result",
+ test: test.structured_clone()
+ });
+ });
+ add_completion_callback(
+ function(tests, harness_status) {
+ this_obj._dispatch({
+ type: "complete",
+ tests: map(tests,
+ function(test) {
+ return test.structured_clone();
+ }),
+ status: harness_status.structured_clone()
+ });
+ });
+ };
+
+ WorkerTestEnvironment.prototype.add_on_loaded_callback = function() {};
+
+ WorkerTestEnvironment.prototype.test_timeout = function() {
+ // Tests running in a worker don't have a default timeout. I.e. all
+ // worker tests behave as if settings.explicit_timeout is true.
+ return null;
+ };
+
+ WorkerTestEnvironment.prototype.global_scope = function() {
+ return self;
+ };
+
+ /*
+ * Dedicated web workers.
+ * https://html.spec.whatwg.org/multipage/workers.html#dedicatedworkerglobalscope
+ *
+ * This class is used as the test_environment when testharness is running
+ * inside a dedicated worker.
+ */
+ function DedicatedWorkerTestEnvironment() {
+ WorkerTestEnvironment.call(this);
+ // self is an instance of DedicatedWorkerGlobalScope which exposes
+ // a postMessage() method for communicating via the message channel
+ // established when the worker is created.
+ this._add_message_port(self);
+ }
+ DedicatedWorkerTestEnvironment.prototype = Object.create(WorkerTestEnvironment.prototype);
+
+ DedicatedWorkerTestEnvironment.prototype.on_tests_ready = function() {
+ WorkerTestEnvironment.prototype.on_tests_ready.call(this);
+ // In the absence of an onload notification, we a require dedicated
+ // workers to explicitly signal when the tests are done.
+ tests.wait_for_finish = true;
+ };
+
+ /*
+ * Shared web workers.
+ * https://html.spec.whatwg.org/multipage/workers.html#sharedworkerglobalscope
+ *
+ * This class is used as the test_environment when testharness is running
+ * inside a shared web worker.
+ */
+ function SharedWorkerTestEnvironment() {
+ WorkerTestEnvironment.call(this);
+ var this_obj = this;
+ // Shared workers receive message ports via the 'onconnect' event for
+ // each connection.
+ self.addEventListener("connect",
+ function(message_event) {
+ this_obj._add_message_port(message_event.source);
+ });
+ }
+ SharedWorkerTestEnvironment.prototype = Object.create(WorkerTestEnvironment.prototype);
+
+ SharedWorkerTestEnvironment.prototype.on_tests_ready = function() {
+ WorkerTestEnvironment.prototype.on_tests_ready.call(this);
+ // In the absence of an onload notification, we a require shared
+ // workers to explicitly signal when the tests are done.
+ tests.wait_for_finish = true;
+ };
+
+ /*
+ * Service workers.
+ * http://www.w3.org/TR/service-workers/
+ *
+ * This class is used as the test_environment when testharness is running
+ * inside a service worker.
+ */
+ function ServiceWorkerTestEnvironment() {
+ WorkerTestEnvironment.call(this);
+ this.all_loaded = false;
+ this.on_loaded_callback = null;
+ var this_obj = this;
+ self.addEventListener("message",
+ function(event) {
+ if (event.data.type && event.data.type === "connect") {
+ this_obj._add_message_port(event.ports[0]);
+ event.ports[0].start();
+ }
+ });
+
+ // The oninstall event is received after the service worker script and
+ // all imported scripts have been fetched and executed. It's the
+ // equivalent of an onload event for a document. All tests should have
+ // been added by the time this event is received, thus it's not
+ // necessary to wait until the onactivate event.
+ on_event(self, "install",
+ function(event) {
+ this_obj.all_loaded = true;
+ if (this_obj.on_loaded_callback) {
+ this_obj.on_loaded_callback();
+ }
+ });
+ }
+ ServiceWorkerTestEnvironment.prototype = Object.create(WorkerTestEnvironment.prototype);
+
+ ServiceWorkerTestEnvironment.prototype.add_on_loaded_callback = function(callback) {
+ if (this.all_loaded) {
+ callback();
+ } else {
+ this.on_loaded_callback = callback;
+ }
+ };
+
+ function create_test_environment() {
+ if ('document' in self) {
+ return new WindowTestEnvironment();
+ }
+ if ('DedicatedWorkerGlobalScope' in self &&
+ self instanceof DedicatedWorkerGlobalScope) {
+ return new DedicatedWorkerTestEnvironment();
+ }
+ if ('SharedWorkerGlobalScope' in self &&
+ self instanceof SharedWorkerGlobalScope) {
+ return new SharedWorkerTestEnvironment();
+ }
+ if ('ServiceWorkerGlobalScope' in self &&
+ self instanceof ServiceWorkerGlobalScope) {
+ return new ServiceWorkerTestEnvironment();
+ }
+ throw new Error("Unsupported test environment");
+ }
+
+ var test_environment = create_test_environment();
+
+ function is_shared_worker(worker) {
+ return 'SharedWorker' in self && worker instanceof SharedWorker;
+ }
+
+ function is_service_worker(worker) {
+ return 'ServiceWorker' in self && worker instanceof ServiceWorker;
+ }
+
+ /*
+ * API functions
+ */
+
+ function test(func, name, properties)
+ {
+ var test_name = name ? name : test_environment.next_default_test_name();
+ properties = properties ? properties : {};
+ var test_obj = new Test(test_name, properties);
+ test_obj.step(func, test_obj, test_obj);
+ if (test_obj.phase === test_obj.phases.STARTED) {
+ test_obj.done();
+ }
+ }
+
+ function async_test(func, name, properties)
+ {
+ if (typeof func !== "function") {
+ properties = name;
+ name = func;
+ func = null;
+ }
+ var test_name = name ? name : test_environment.next_default_test_name();
+ properties = properties ? properties : {};
+ var test_obj = new Test(test_name, properties);
+ if (func) {
+ test_obj.step(func, test_obj, test_obj);
+ }
+ return test_obj;
+ }
+
+ function promise_test(func, name, properties) {
+ var test = async_test(name, properties);
+ Promise.resolve(test.step(func, test, test))
+ .then(
+ function() {
+ test.done();
+ })
+ .catch(test.step_func(
+ function(value) {
+ if (value instanceof AssertionError) {
+ throw value;
+ }
+ assert(false, "promise_test", null,
+ "Unhandled rejection with value: ${value}", {value:value});
+ }));
+ }
+
+ function setup(func_or_properties, maybe_properties)
+ {
+ var func = null;
+ var properties = {};
+ if (arguments.length === 2) {
+ func = func_or_properties;
+ properties = maybe_properties;
+ } else if (func_or_properties instanceof Function) {
+ func = func_or_properties;
+ } else {
+ properties = func_or_properties;
+ }
+ tests.setup(func, properties);
+ test_environment.on_new_harness_properties(properties);
+ }
+
+ function done() {
+ if (tests.tests.length === 0) {
+ tests.set_file_is_test();
+ }
+ if (tests.file_is_test) {
+ tests.tests[0].done();
+ }
+ tests.end_wait();
+ }
+
+ function generate_tests(func, args, properties) {
+ forEach(args, function(x, i)
+ {
+ var name = x[0];
+ test(function()
+ {
+ func.apply(this, x.slice(1));
+ },
+ name,
+ Array.isArray(properties) ? properties[i] : properties);
+ });
+ }
+
+ function on_event(object, event, callback)
+ {
+ object.addEventListener(event, callback, false);
+ }
+
+ expose(test, 'test');
+ expose(async_test, 'async_test');
+ expose(promise_test, 'promise_test');
+ expose(generate_tests, 'generate_tests');
+ expose(setup, 'setup');
+ expose(done, 'done');
+ expose(on_event, 'on_event');
+
+ /*
+ * Return a string truncated to the given length, with ... added at the end
+ * if it was longer.
+ */
+ function truncate(s, len)
+ {
+ if (s.length > len) {
+ return s.substring(0, len - 3) + "...";
+ }
+ return s;
+ }
+
+ /*
+ * Return true if object is probably a Node object.
+ */
+ function is_node(object)
+ {
+ // I use duck-typing instead of instanceof, because
+ // instanceof doesn't work if the node is from another window (like an
+ // iframe's contentWindow):
+ // http://www.w3.org/Bugs/Public/show_bug.cgi?id=12295
+ if ("nodeType" in object &&
+ "nodeName" in object &&
+ "nodeValue" in object &&
+ "childNodes" in object) {
+ try {
+ object.nodeType;
+ } catch (e) {
+ // The object is probably Node.prototype or another prototype
+ // object that inherits from it, and not a Node instance.
+ return false;
+ }
+ return true;
+ }
+ return false;
+ }
+
+ /*
+ * Convert a value to a nice, human-readable string
+ */
+ function format_value(val, seen)
+ {
+ if (!seen) {
+ seen = [];
+ }
+ if (typeof val === "object" && val !== null) {
+ if (seen.indexOf(val) >= 0) {
+ return "[...]";
+ }
+ seen.push(val);
+ }
+ if (Array.isArray(val)) {
+ return "[" + val.map(function(x) {return format_value(x, seen);}).join(", ") + "]";
+ }
+
+ switch (typeof val) {
+ case "string":
+ val = val.replace("\\", "\\\\");
+ for (var i = 0; i < 32; i++) {
+ var replace = "\\";
+ switch (i) {
+ case 0: replace += "0"; break;
+ case 1: replace += "x01"; break;
+ case 2: replace += "x02"; break;
+ case 3: replace += "x03"; break;
+ case 4: replace += "x04"; break;
+ case 5: replace += "x05"; break;
+ case 6: replace += "x06"; break;
+ case 7: replace += "x07"; break;
+ case 8: replace += "b"; break;
+ case 9: replace += "t"; break;
+ case 10: replace += "n"; break;
+ case 11: replace += "v"; break;
+ case 12: replace += "f"; break;
+ case 13: replace += "r"; break;
+ case 14: replace += "x0e"; break;
+ case 15: replace += "x0f"; break;
+ case 16: replace += "x10"; break;
+ case 17: replace += "x11"; break;
+ case 18: replace += "x12"; break;
+ case 19: replace += "x13"; break;
+ case 20: replace += "x14"; break;
+ case 21: replace += "x15"; break;
+ case 22: replace += "x16"; break;
+ case 23: replace += "x17"; break;
+ case 24: replace += "x18"; break;
+ case 25: replace += "x19"; break;
+ case 26: replace += "x1a"; break;
+ case 27: replace += "x1b"; break;
+ case 28: replace += "x1c"; break;
+ case 29: replace += "x1d"; break;
+ case 30: replace += "x1e"; break;
+ case 31: replace += "x1f"; break;
+ }
+ val = val.replace(RegExp(String.fromCharCode(i), "g"), replace);
+ }
+ return '"' + val.replace(/"/g, '\\"') + '"';
+ case "boolean":
+ case "undefined":
+ return String(val);
+ case "number":
+ // In JavaScript, -0 === 0 and String(-0) == "0", so we have to
+ // special-case.
+ if (val === -0 && 1/val === -Infinity) {
+ return "-0";
+ }
+ return String(val);
+ case "object":
+ if (val === null) {
+ return "null";
+ }
+
+ // Special-case Node objects, since those come up a lot in my tests. I
+ // ignore namespaces.
+ if (is_node(val)) {
+ switch (val.nodeType) {
+ case Node.ELEMENT_NODE:
+ var ret = "<" + val.localName;
+ for (var i = 0; i < val.attributes.length; i++) {
+ ret += " " + val.attributes[i].name + '="' + val.attributes[i].value + '"';
+ }
+ ret += ">" + val.innerHTML + "</" + val.localName + ">";
+ return "Element node " + truncate(ret, 60);
+ case Node.TEXT_NODE:
+ return 'Text node "' + truncate(val.data, 60) + '"';
+ case Node.PROCESSING_INSTRUCTION_NODE:
+ return "ProcessingInstruction node with target " + format_value(truncate(val.target, 60)) + " and data " + format_value(truncate(val.data, 60));
+ case Node.COMMENT_NODE:
+ return "Comment node <!--" + truncate(val.data, 60) + "-->";
+ case Node.DOCUMENT_NODE:
+ return "Document node with " + val.childNodes.length + (val.childNodes.length == 1 ? " child" : " children");
+ case Node.DOCUMENT_TYPE_NODE:
+ return "DocumentType node";
+ case Node.DOCUMENT_FRAGMENT_NODE:
+ return "DocumentFragment node with " + val.childNodes.length + (val.childNodes.length == 1 ? " child" : " children");
+ default:
+ return "Node object of unknown type";
+ }
+ }
+
+ /* falls through */
+ default:
+ return typeof val + ' "' + truncate(String(val), 60) + '"';
+ }
+ }
+ expose(format_value, "format_value");
+
+ /*
+ * Assertions
+ */
+
+ function assert_true(actual, description)
+ {
+ assert(actual === true, "assert_true", description,
+ "expected true got ${actual}", {actual:actual});
+ }
+ expose(assert_true, "assert_true");
+
+ function assert_false(actual, description)
+ {
+ assert(actual === false, "assert_false", description,
+ "expected false got ${actual}", {actual:actual});
+ }
+ expose(assert_false, "assert_false");
+
+ function same_value(x, y) {
+ if (y !== y) {
+ //NaN case
+ return x !== x;
+ }
+ if (x === 0 && y === 0) {
+ //Distinguish +0 and -0
+ return 1/x === 1/y;
+ }
+ return x === y;
+ }
+
+ function assert_equals(actual, expected, description)
+ {
+ /*
+ * Test if two primitives are equal or two objects
+ * are the same object
+ */
+ if (typeof actual != typeof expected) {
+ assert(false, "assert_equals", description,
+ "expected (" + typeof expected + ") ${expected} but got (" + typeof actual + ") ${actual}",
+ {expected:expected, actual:actual});
+ return;
+ }
+ assert(same_value(actual, expected), "assert_equals", description,
+ "expected ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_equals, "assert_equals");
+
+ function assert_not_equals(actual, expected, description)
+ {
+ /*
+ * Test if two primitives are unequal or two objects
+ * are different objects
+ */
+ assert(!same_value(actual, expected), "assert_not_equals", description,
+ "got disallowed value ${actual}",
+ {actual:actual});
+ }
+ expose(assert_not_equals, "assert_not_equals");
+
+ function assert_in_array(actual, expected, description)
+ {
+ assert(expected.indexOf(actual) != -1, "assert_in_array", description,
+ "value ${actual} not in array ${expected}",
+ {actual:actual, expected:expected});
+ }
+ expose(assert_in_array, "assert_in_array");
+
+ function assert_object_equals(actual, expected, description)
+ {
+ //This needs to be improved a great deal
+ function check_equal(actual, expected, stack)
+ {
+ stack.push(actual);
+
+ var p;
+ for (p in actual) {
+ assert(expected.hasOwnProperty(p), "assert_object_equals", description,
+ "unexpected property ${p}", {p:p});
+
+ if (typeof actual[p] === "object" && actual[p] !== null) {
+ if (stack.indexOf(actual[p]) === -1) {
+ check_equal(actual[p], expected[p], stack);
+ }
+ } else {
+ assert(same_value(actual[p], expected[p]), "assert_object_equals", description,
+ "property ${p} expected ${expected} got ${actual}",
+ {p:p, expected:expected, actual:actual});
+ }
+ }
+ for (p in expected) {
+ assert(actual.hasOwnProperty(p),
+ "assert_object_equals", description,
+ "expected property ${p} missing", {p:p});
+ }
+ stack.pop();
+ }
+ check_equal(actual, expected, []);
+ }
+ expose(assert_object_equals, "assert_object_equals");
+
+ function assert_array_equals(actual, expected, description)
+ {
+ assert(actual.length === expected.length,
+ "assert_array_equals", description,
+ "lengths differ, expected ${expected} got ${actual}",
+ {expected:expected.length, actual:actual.length});
+
+ for (var i = 0; i < actual.length; i++) {
+ assert(actual.hasOwnProperty(i) === expected.hasOwnProperty(i),
+ "assert_array_equals", description,
+ "property ${i}, property expected to be ${expected} but was ${actual}",
+ {i:i, expected:expected.hasOwnProperty(i) ? "present" : "missing",
+ actual:actual.hasOwnProperty(i) ? "present" : "missing"});
+ assert(same_value(expected[i], actual[i]),
+ "assert_array_equals", description,
+ "property ${i}, expected ${expected} but got ${actual}",
+ {i:i, expected:expected[i], actual:actual[i]});
+ }
+ }
+ expose(assert_array_equals, "assert_array_equals");
+
+ function assert_approx_equals(actual, expected, epsilon, description)
+ {
+ /*
+ * Test if two primitive numbers are equal withing +/- epsilon
+ */
+ assert(typeof actual === "number",
+ "assert_approx_equals", description,
+ "expected a number but got a ${type_actual}",
+ {type_actual:typeof actual});
+
+ assert(Math.abs(actual - expected) <= epsilon,
+ "assert_approx_equals", description,
+ "expected ${expected} +/- ${epsilon} but got ${actual}",
+ {expected:expected, actual:actual, epsilon:epsilon});
+ }
+ expose(assert_approx_equals, "assert_approx_equals");
+
+ function assert_less_than(actual, expected, description)
+ {
+ /*
+ * Test if a primitive number is less than another
+ */
+ assert(typeof actual === "number",
+ "assert_less_than", description,
+ "expected a number but got a ${type_actual}",
+ {type_actual:typeof actual});
+
+ assert(actual < expected,
+ "assert_less_than", description,
+ "expected a number less than ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_less_than, "assert_less_than");
+
+ function assert_greater_than(actual, expected, description)
+ {
+ /*
+ * Test if a primitive number is greater than another
+ */
+ assert(typeof actual === "number",
+ "assert_greater_than", description,
+ "expected a number but got a ${type_actual}",
+ {type_actual:typeof actual});
+
+ assert(actual > expected,
+ "assert_greater_than", description,
+ "expected a number greater than ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_greater_than, "assert_greater_than");
+
+ function assert_less_than_equal(actual, expected, description)
+ {
+ /*
+ * Test if a primitive number is less than or equal to another
+ */
+ assert(typeof actual === "number",
+ "assert_less_than_equal", description,
+ "expected a number but got a ${type_actual}",
+ {type_actual:typeof actual});
+
+ assert(actual <= expected,
+ "assert_less_than", description,
+ "expected a number less than or equal to ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_less_than_equal, "assert_less_than_equal");
+
+ function assert_greater_than_equal(actual, expected, description)
+ {
+ /*
+ * Test if a primitive number is greater than or equal to another
+ */
+ assert(typeof actual === "number",
+ "assert_greater_than_equal", description,
+ "expected a number but got a ${type_actual}",
+ {type_actual:typeof actual});
+
+ assert(actual >= expected,
+ "assert_greater_than_equal", description,
+ "expected a number greater than or equal to ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_greater_than_equal, "assert_greater_than_equal");
+
+ function assert_regexp_match(actual, expected, description) {
+ /*
+ * Test if a string (actual) matches a regexp (expected)
+ */
+ assert(expected.test(actual),
+ "assert_regexp_match", description,
+ "expected ${expected} but got ${actual}",
+ {expected:expected, actual:actual});
+ }
+ expose(assert_regexp_match, "assert_regexp_match");
+
+ function assert_class_string(object, class_string, description) {
+ assert_equals({}.toString.call(object), "[object " + class_string + "]",
+ description);
+ }
+ expose(assert_class_string, "assert_class_string");
+
+
+ function _assert_own_property(name) {
+ return function(object, property_name, description)
+ {
+ assert(property_name in object,
+ name, description,
+ "expected property ${p} missing", {p:property_name});
+ };
+ }
+ expose(_assert_own_property("assert_exists"), "assert_exists");
+ expose(_assert_own_property("assert_own_property"), "assert_own_property");
+
+ function assert_not_exists(object, property_name, description)
+ {
+ assert(!object.hasOwnProperty(property_name),
+ "assert_not_exists", description,
+ "unexpected property ${p} found", {p:property_name});
+ }
+ expose(assert_not_exists, "assert_not_exists");
+
+ function _assert_inherits(name) {
+ return function (object, property_name, description)
+ {
+ assert(typeof object === "object",
+ name, description,
+ "provided value is not an object");
+
+ assert("hasOwnProperty" in object,
+ name, description,
+ "provided value is an object but has no hasOwnProperty method");
+
+ assert(!object.hasOwnProperty(property_name),
+ name, description,
+ "property ${p} found on object expected in prototype chain",
+ {p:property_name});
+
+ assert(property_name in object,
+ name, description,
+ "property ${p} not found in prototype chain",
+ {p:property_name});
+ };
+ }
+ expose(_assert_inherits("assert_inherits"), "assert_inherits");
+ expose(_assert_inherits("assert_idl_attribute"), "assert_idl_attribute");
+
+ function assert_readonly(object, property_name, description)
+ {
+ var initial_value = object[property_name];
+ try {
+ //Note that this can have side effects in the case where
+ //the property has PutForwards
+ object[property_name] = initial_value + "a"; //XXX use some other value here?
+ assert(same_value(object[property_name], initial_value),
+ "assert_readonly", description,
+ "changing property ${p} succeeded",
+ {p:property_name});
+ } finally {
+ object[property_name] = initial_value;
+ }
+ }
+ expose(assert_readonly, "assert_readonly");
+
+ function assert_throws(code, func, description)
+ {
+ try {
+ func.call(this);
+ assert(false, "assert_throws", description,
+ "${func} did not throw", {func:func});
+ } catch (e) {
+ if (e instanceof AssertionError) {
+ throw e;
+ }
+ if (code === null) {
+ return;
+ }
+ if (typeof code === "object") {
+ assert(typeof e == "object" && "name" in e && e.name == code.name,
+ "assert_throws", description,
+ "${func} threw ${actual} (${actual_name}) expected ${expected} (${expected_name})",
+ {func:func, actual:e, actual_name:e.name,
+ expected:code,
+ expected_name:code.name});
+ return;
+ }
+
+ var code_name_map = {
+ INDEX_SIZE_ERR: 'IndexSizeError',
+ HIERARCHY_REQUEST_ERR: 'HierarchyRequestError',
+ WRONG_DOCUMENT_ERR: 'WrongDocumentError',
+ INVALID_CHARACTER_ERR: 'InvalidCharacterError',
+ NO_MODIFICATION_ALLOWED_ERR: 'NoModificationAllowedError',
+ NOT_FOUND_ERR: 'NotFoundError',
+ NOT_SUPPORTED_ERR: 'NotSupportedError',
+ INVALID_STATE_ERR: 'InvalidStateError',
+ SYNTAX_ERR: 'SyntaxError',
+ INVALID_MODIFICATION_ERR: 'InvalidModificationError',
+ NAMESPACE_ERR: 'NamespaceError',
+ INVALID_ACCESS_ERR: 'InvalidAccessError',
+ TYPE_MISMATCH_ERR: 'TypeMismatchError',
+ SECURITY_ERR: 'SecurityError',
+ NETWORK_ERR: 'NetworkError',
+ ABORT_ERR: 'AbortError',
+ URL_MISMATCH_ERR: 'URLMismatchError',
+ QUOTA_EXCEEDED_ERR: 'QuotaExceededError',
+ TIMEOUT_ERR: 'TimeoutError',
+ INVALID_NODE_TYPE_ERR: 'InvalidNodeTypeError',
+ DATA_CLONE_ERR: 'DataCloneError'
+ };
+
+ var name = code in code_name_map ? code_name_map[code] : code;
+
+ var name_code_map = {
+ IndexSizeError: 1,
+ HierarchyRequestError: 3,
+ WrongDocumentError: 4,
+ InvalidCharacterError: 5,
+ NoModificationAllowedError: 7,
+ NotFoundError: 8,
+ NotSupportedError: 9,
+ InvalidStateError: 11,
+ SyntaxError: 12,
+ InvalidModificationError: 13,
+ NamespaceError: 14,
+ InvalidAccessError: 15,
+ TypeMismatchError: 17,
+ SecurityError: 18,
+ NetworkError: 19,
+ AbortError: 20,
+ URLMismatchError: 21,
+ QuotaExceededError: 22,
+ TimeoutError: 23,
+ InvalidNodeTypeError: 24,
+ DataCloneError: 25,
+
+ UnknownError: 0,
+ ConstraintError: 0,
+ DataError: 0,
+ TransactionInactiveError: 0,
+ ReadOnlyError: 0,
+ VersionError: 0
+ };
+
+ if (!(name in name_code_map)) {
+ throw new AssertionError('Test bug: unrecognized DOMException code "' + code + '" passed to assert_throws()');
+ }
+
+ var required_props = { code: name_code_map[name] };
+
+ if (required_props.code === 0 ||
+ ("name" in e && e.name !== e.name.toUpperCase() && e.name !== "DOMException")) {
+ // New style exception: also test the name property.
+ required_props.name = name;
+ }
+
+ //We'd like to test that e instanceof the appropriate interface,
+ //but we can't, because we don't know what window it was created
+ //in. It might be an instanceof the appropriate interface on some
+ //unknown other window. TODO: Work around this somehow?
+
+ assert(typeof e == "object",
+ "assert_throws", description,
+ "${func} threw ${e} with type ${type}, not an object",
+ {func:func, e:e, type:typeof e});
+
+ for (var prop in required_props) {
+ assert(typeof e == "object" && prop in e && e[prop] == required_props[prop],
+ "assert_throws", description,
+ "${func} threw ${e} that is not a DOMException " + code + ": property ${prop} is equal to ${actual}, expected ${expected}",
+ {func:func, e:e, prop:prop, actual:e[prop], expected:required_props[prop]});
+ }
+ }
+ }
+ expose(assert_throws, "assert_throws");
+
+ function assert_unreached(description) {
+ assert(false, "assert_unreached", description,
+ "Reached unreachable code");
+ }
+ expose(assert_unreached, "assert_unreached");
+
+ function assert_any(assert_func, actual, expected_array)
+ {
+ var args = [].slice.call(arguments, 3);
+ var errors = [];
+ var passed = false;
+ forEach(expected_array,
+ function(expected)
+ {
+ try {
+ assert_func.apply(this, [actual, expected].concat(args));
+ passed = true;
+ } catch (e) {
+ errors.push(e.message);
+ }
+ });
+ if (!passed) {
+ throw new AssertionError(errors.join("\n\n"));
+ }
+ }
+ expose(assert_any, "assert_any");
+
+ function Test(name, properties)
+ {
+ if (tests.file_is_test && tests.tests.length) {
+ throw new Error("Tried to create a test with file_is_test");
+ }
+ this.name = name;
+
+ this.phase = this.phases.INITIAL;
+
+ this.status = this.NOTRUN;
+ this.timeout_id = null;
+ this.index = null;
+
+ this.properties = properties;
+ var timeout = properties.timeout ? properties.timeout : settings.test_timeout;
+ if (timeout !== null) {
+ this.timeout_length = timeout * tests.timeout_multiplier;
+ } else {
+ this.timeout_length = null;
+ }
+
+ this.message = null;
+
+ this.steps = [];
+
+ this.cleanup_callbacks = [];
+
+ tests.push(this);
+ }
+
+ Test.statuses = {
+ PASS:0,
+ FAIL:1,
+ TIMEOUT:2,
+ NOTRUN:3
+ };
+
+ Test.prototype = merge({}, Test.statuses);
+
+ Test.prototype.phases = {
+ INITIAL:0,
+ STARTED:1,
+ HAS_RESULT:2,
+ COMPLETE:3
+ };
+
+ Test.prototype.structured_clone = function()
+ {
+ if (!this._structured_clone) {
+ var msg = this.message;
+ msg = msg ? String(msg) : msg;
+ this._structured_clone = merge({
+ name:String(this.name),
+ properties:merge({}, this.properties),
+ }, Test.statuses);
+ }
+ this._structured_clone.status = this.status;
+ this._structured_clone.message = this.message;
+ this._structured_clone.index = this.index;
+ return this._structured_clone;
+ };
+
+ Test.prototype.step = function(func, this_obj)
+ {
+ if (this.phase > this.phases.STARTED) {
+ return;
+ }
+ this.phase = this.phases.STARTED;
+ //If we don't get a result before the harness times out that will be a test timout
+ this.set_status(this.TIMEOUT, "Test timed out");
+
+ tests.started = true;
+ tests.notify_test_state(this);
+
+ if (this.timeout_id === null) {
+ this.set_timeout();
+ }
+
+ this.steps.push(func);
+
+ if (arguments.length === 1) {
+ this_obj = this;
+ }
+
+ try {
+ return func.apply(this_obj, Array.prototype.slice.call(arguments, 2));
+ } catch (e) {
+ if (this.phase >= this.phases.HAS_RESULT) {
+ return;
+ }
+ var message = (typeof e === "object" && e !== null) ? e.message : e;
+ if (typeof e.stack != "undefined" && typeof e.message == "string") {
+ //Try to make it more informative for some exceptions, at least
+ //in Gecko and WebKit. This results in a stack dump instead of
+ //just errors like "Cannot read property 'parentNode' of null"
+ //or "root is null". Makes it a lot longer, of course.
+ message += "(stack: " + e.stack + ")";
+ }
+ this.set_status(this.FAIL, message);
+ this.phase = this.phases.HAS_RESULT;
+ this.done();
+ }
+ };
+
+ Test.prototype.step_func = function(func, this_obj)
+ {
+ var test_this = this;
+
+ if (arguments.length === 1) {
+ this_obj = test_this;
+ }
+
+ return function()
+ {
+ return test_this.step.apply(test_this, [func, this_obj].concat(
+ Array.prototype.slice.call(arguments)));
+ };
+ };
+
+ Test.prototype.step_func_done = function(func, this_obj)
+ {
+ var test_this = this;
+
+ if (arguments.length === 1) {
+ this_obj = test_this;
+ }
+
+ return function()
+ {
+ if (func) {
+ test_this.step.apply(test_this, [func, this_obj].concat(
+ Array.prototype.slice.call(arguments)));
+ }
+ test_this.done();
+ };
+ };
+
+ Test.prototype.unreached_func = function(description)
+ {
+ return this.step_func(function() {
+ assert_unreached(description);
+ });
+ };
+
+ Test.prototype.add_cleanup = function(callback) {
+ this.cleanup_callbacks.push(callback);
+ };
+
+ Test.prototype.force_timeout = function() {
+ this.set_status(this.TIMEOUT);
+ this.phase = this.phases.HAS_RESULT;
+ };
+
+ Test.prototype.set_timeout = function()
+ {
+ if (this.timeout_length !== null) {
+ var this_obj = this;
+ this.timeout_id = setTimeout(function()
+ {
+ this_obj.timeout();
+ }, this.timeout_length);
+ }
+ };
+
+ Test.prototype.set_status = function(status, message)
+ {
+ this.status = status;
+ this.message = message;
+ };
+
+ Test.prototype.timeout = function()
+ {
+ this.timeout_id = null;
+ this.set_status(this.TIMEOUT, "Test timed out");
+ this.phase = this.phases.HAS_RESULT;
+ this.done();
+ };
+
+ Test.prototype.done = function()
+ {
+ if (this.phase == this.phases.COMPLETE) {
+ return;
+ }
+
+ if (this.phase <= this.phases.STARTED) {
+ this.set_status(this.PASS, null);
+ }
+
+ this.phase = this.phases.COMPLETE;
+
+ clearTimeout(this.timeout_id);
+ tests.result(this);
+ this.cleanup();
+ };
+
+ Test.prototype.cleanup = function() {
+ forEach(this.cleanup_callbacks,
+ function(cleanup_callback) {
+ cleanup_callback();
+ });
+ };
+
+ /*
+ * A RemoteTest object mirrors a Test object on a remote worker. The
+ * associated RemoteWorker updates the RemoteTest object in response to
+ * received events. In turn, the RemoteTest object replicates these events
+ * on the local document. This allows listeners (test result reporting
+ * etc..) to transparently handle local and remote events.
+ */
+ function RemoteTest(clone) {
+ var this_obj = this;
+ Object.keys(clone).forEach(
+ function(key) {
+ this_obj[key] = clone[key];
+ });
+ this.index = null;
+ this.phase = this.phases.INITIAL;
+ this.update_state_from(clone);
+ tests.push(this);
+ }
+
+ RemoteTest.prototype.structured_clone = function() {
+ var clone = {};
+ Object.keys(this).forEach(
+ function(key) {
+ if (typeof(this[key]) === "object") {
+ clone[key] = merge({}, this[key]);
+ } else {
+ clone[key] = this[key];
+ }
+ });
+ clone.phases = merge({}, this.phases);
+ return clone;
+ };
+
+ RemoteTest.prototype.cleanup = function() {};
+ RemoteTest.prototype.phases = Test.prototype.phases;
+ RemoteTest.prototype.update_state_from = function(clone) {
+ this.status = clone.status;
+ this.message = clone.message;
+ if (this.phase === this.phases.INITIAL) {
+ this.phase = this.phases.STARTED;
+ }
+ };
+ RemoteTest.prototype.done = function() {
+ this.phase = this.phases.COMPLETE;
+ }
+
+ /*
+ * A RemoteWorker listens for test events from a worker. These events are
+ * then used to construct and maintain RemoteTest objects that mirror the
+ * tests running on the remote worker.
+ */
+ function RemoteWorker(worker) {
+ this.running = true;
+ this.tests = new Array();
+
+ var this_obj = this;
+ worker.onerror = function(error) { this_obj.worker_error(error); };
+
+ var message_port;
+
+ if (is_service_worker(worker)) {
+ // The ServiceWorker's implicit MessagePort is currently not
+ // reliably accessible from the ServiceWorkerGlobalScope due to
+ // Blink setting MessageEvent.source to null for messages sent via
+ // ServiceWorker.postMessage(). Until that's resolved, create an
+ // explicit MessageChannel and pass one end to the worker.
+ var message_channel = new MessageChannel();
+ message_port = message_channel.port1;
+ message_port.start();
+ worker.postMessage({type: "connect"}, [message_channel.port2]);
+ } else if (is_shared_worker(worker)) {
+ message_port = worker.port;
+ } else {
+ message_port = worker;
+ }
+
+ // Keeping a reference to the worker until worker_done() is seen
+ // prevents the Worker object and its MessageChannel from going away
+ // before all the messages are dispatched.
+ this.worker = worker;
+
+ message_port.onmessage =
+ function(message) {
+ if (this_obj.running && (message.data.type in this_obj.message_handlers)) {
+ this_obj.message_handlers[message.data.type].call(this_obj, message.data);
+ }
+ };
+ }
+
+ RemoteWorker.prototype.worker_error = function(error) {
+ var message = error.message || String(error);
+ var filename = (error.filename ? " " + error.filename: "");
+ // FIXME: Display worker error states separately from main document
+ // error state.
+ this.worker_done({
+ status: {
+ status: tests.status.ERROR,
+ message: "Error in worker" + filename + ": " + message
+ }
+ });
+ error.preventDefault();
+ };
+
+ RemoteWorker.prototype.test_state = function(data) {
+ var remote_test = this.tests[data.test.index];
+ if (!remote_test) {
+ remote_test = new RemoteTest(data.test);
+ this.tests[data.test.index] = remote_test;
+ }
+ remote_test.update_state_from(data.test);
+ tests.notify_test_state(remote_test);
+ };
+
+ RemoteWorker.prototype.test_done = function(data) {
+ var remote_test = this.tests[data.test.index];
+ remote_test.update_state_from(data.test);
+ remote_test.done();
+ tests.result(remote_test);
+ };
+
+ RemoteWorker.prototype.worker_done = function(data) {
+ if (tests.status.status === null &&
+ data.status.status !== data.status.OK) {
+ tests.status.status = data.status.status;
+ tests.status.message = data.status.message;
+ }
+ this.running = false;
+ this.worker = null;
+ if (tests.all_done()) {
+ tests.complete();
+ }
+ };
+
+ RemoteWorker.prototype.message_handlers = {
+ test_state: RemoteWorker.prototype.test_state,
+ result: RemoteWorker.prototype.test_done,
+ complete: RemoteWorker.prototype.worker_done
+ };
+
+ /*
+ * Harness
+ */
+
+ function TestsStatus()
+ {
+ this.status = null;
+ this.message = null;
+ }
+
+ TestsStatus.statuses = {
+ OK:0,
+ ERROR:1,
+ TIMEOUT:2
+ };
+
+ TestsStatus.prototype = merge({}, TestsStatus.statuses);
+
+ TestsStatus.prototype.structured_clone = function()
+ {
+ if (!this._structured_clone) {
+ var msg = this.message;
+ msg = msg ? String(msg) : msg;
+ this._structured_clone = merge({
+ status:this.status,
+ message:msg
+ }, TestsStatus.statuses);
+ }
+ return this._structured_clone;
+ };
+
+ function Tests()
+ {
+ this.tests = [];
+ this.num_pending = 0;
+
+ this.phases = {
+ INITIAL:0,
+ SETUP:1,
+ HAVE_TESTS:2,
+ HAVE_RESULTS:3,
+ COMPLETE:4
+ };
+ this.phase = this.phases.INITIAL;
+
+ this.properties = {};
+
+ this.wait_for_finish = false;
+ this.processing_callbacks = false;
+
+ this.allow_uncaught_exception = false;
+
+ this.file_is_test = false;
+
+ this.timeout_multiplier = 1;
+ this.timeout_length = test_environment.test_timeout();
+ this.timeout_id = null;
+
+ this.start_callbacks = [];
+ this.test_state_callbacks = [];
+ this.test_done_callbacks = [];
+ this.all_done_callbacks = [];
+
+ this.pending_workers = [];
+
+ this.status = new TestsStatus();
+
+ var this_obj = this;
+
+ test_environment.add_on_loaded_callback(function() {
+ if (this_obj.all_done()) {
+ this_obj.complete();
+ }
+ });
+
+ this.set_timeout();
+ }
+
+ Tests.prototype.setup = function(func, properties)
+ {
+ if (this.phase >= this.phases.HAVE_RESULTS) {
+ return;
+ }
+
+ if (this.phase < this.phases.SETUP) {
+ this.phase = this.phases.SETUP;
+ }
+
+ this.properties = properties;
+
+ for (var p in properties) {
+ if (properties.hasOwnProperty(p)) {
+ var value = properties[p];
+ if (p == "allow_uncaught_exception") {
+ this.allow_uncaught_exception = value;
+ } else if (p == "explicit_done" && value) {
+ this.wait_for_finish = true;
+ } else if (p == "explicit_timeout" && value) {
+ this.timeout_length = null;
+ if (this.timeout_id)
+ {
+ clearTimeout(this.timeout_id);
+ }
+ } else if (p == "timeout_multiplier") {
+ this.timeout_multiplier = value;
+ }
+ }
+ }
+
+ if (func) {
+ try {
+ func();
+ } catch (e) {
+ this.status.status = this.status.ERROR;
+ this.status.message = String(e);
+ }
+ }
+ this.set_timeout();
+ };
+
+ Tests.prototype.set_file_is_test = function() {
+ if (this.tests.length > 0) {
+ throw new Error("Tried to set file as test after creating a test");
+ }
+ this.wait_for_finish = true;
+ this.file_is_test = true;
+ // Create the test, which will add it to the list of tests
+ async_test();
+ };
+
+ Tests.prototype.set_timeout = function() {
+ var this_obj = this;
+ clearTimeout(this.timeout_id);
+ if (this.timeout_length !== null) {
+ this.timeout_id = setTimeout(function() {
+ this_obj.timeout();
+ }, this.timeout_length);
+ }
+ };
+
+ Tests.prototype.timeout = function() {
+ if (this.status.status === null) {
+ this.status.status = this.status.TIMEOUT;
+ }
+ this.complete();
+ };
+
+ Tests.prototype.end_wait = function()
+ {
+ this.wait_for_finish = false;
+ if (this.all_done()) {
+ this.complete();
+ }
+ };
+
+ Tests.prototype.push = function(test)
+ {
+ if (this.phase < this.phases.HAVE_TESTS) {
+ this.start();
+ }
+ this.num_pending++;
+ test.index = this.tests.push(test);
+ this.notify_test_state(test);
+ };
+
+ Tests.prototype.notify_test_state = function(test) {
+ var this_obj = this;
+ forEach(this.test_state_callbacks,
+ function(callback) {
+ callback(test, this_obj);
+ });
+ };
+
+ Tests.prototype.all_done = function() {
+ return (this.tests.length > 0 && test_environment.all_loaded &&
+ this.num_pending === 0 && !this.wait_for_finish &&
+ !this.processing_callbacks &&
+ !this.pending_workers.some(function(w) { return w.running; }));
+ };
+
+ Tests.prototype.start = function() {
+ this.phase = this.phases.HAVE_TESTS;
+ this.notify_start();
+ };
+
+ Tests.prototype.notify_start = function() {
+ var this_obj = this;
+ forEach (this.start_callbacks,
+ function(callback)
+ {
+ callback(this_obj.properties);
+ });
+ };
+
+ Tests.prototype.result = function(test)
+ {
+ if (this.phase > this.phases.HAVE_RESULTS) {
+ return;
+ }
+ this.phase = this.phases.HAVE_RESULTS;
+ this.num_pending--;
+ this.notify_result(test);
+ };
+
+ Tests.prototype.notify_result = function(test) {
+ var this_obj = this;
+ this.processing_callbacks = true;
+ forEach(this.test_done_callbacks,
+ function(callback)
+ {
+ callback(test, this_obj);
+ });
+ this.processing_callbacks = false;
+ if (this_obj.all_done()) {
+ this_obj.complete();
+ }
+ };
+
+ Tests.prototype.complete = function() {
+ if (this.phase === this.phases.COMPLETE) {
+ return;
+ }
+ this.phase = this.phases.COMPLETE;
+ var this_obj = this;
+ this.tests.forEach(
+ function(x)
+ {
+ if (x.phase < x.phases.COMPLETE) {
+ this_obj.notify_result(x);
+ x.cleanup();
+ x.phase = x.phases.COMPLETE;
+ }
+ }
+ );
+ this.notify_complete();
+ };
+
+ Tests.prototype.notify_complete = function() {
+ var this_obj = this;
+ if (this.status.status === null) {
+ this.status.status = this.status.OK;
+ }
+
+ forEach (this.all_done_callbacks,
+ function(callback)
+ {
+ callback(this_obj.tests, this_obj.status);
+ });
+ };
+
+ Tests.prototype.fetch_tests_from_worker = function(worker) {
+ if (this.phase >= this.phases.COMPLETE) {
+ return;
+ }
+
+ this.pending_workers.push(new RemoteWorker(worker));
+ };
+
+ function fetch_tests_from_worker(port) {
+ tests.fetch_tests_from_worker(port);
+ }
+ expose(fetch_tests_from_worker, 'fetch_tests_from_worker');
+
+ function timeout() {
+ if (tests.timeout_length === null) {
+ tests.timeout();
+ }
+ }
+ expose(timeout, 'timeout');
+
+ function add_start_callback(callback) {
+ tests.start_callbacks.push(callback);
+ }
+
+ function add_test_state_callback(callback) {
+ tests.test_state_callbacks.push(callback);
+ }
+
+ function add_result_callback(callback)
+ {
+ tests.test_done_callbacks.push(callback);
+ }
+
+ function add_completion_callback(callback)
+ {
+ tests.all_done_callbacks.push(callback);
+ }
+
+ expose(add_start_callback, 'add_start_callback');
+ expose(add_test_state_callback, 'add_test_state_callback');
+ expose(add_result_callback, 'add_result_callback');
+ expose(add_completion_callback, 'add_completion_callback');
+
+ /*
+ * Output listener
+ */
+
+ function Output() {
+ this.output_document = document;
+ this.output_node = null;
+ this.enabled = settings.output;
+ this.phase = this.INITIAL;
+ }
+
+ Output.prototype.INITIAL = 0;
+ Output.prototype.STARTED = 1;
+ Output.prototype.HAVE_RESULTS = 2;
+ Output.prototype.COMPLETE = 3;
+
+ Output.prototype.setup = function(properties) {
+ if (this.phase > this.INITIAL) {
+ return;
+ }
+
+ //If output is disabled in testharnessreport.js the test shouldn't be
+ //able to override that
+ this.enabled = this.enabled && (properties.hasOwnProperty("output") ?
+ properties.output : settings.output);
+ };
+
+ Output.prototype.init = function(properties) {
+ if (this.phase >= this.STARTED) {
+ return;
+ }
+ if (properties.output_document) {
+ this.output_document = properties.output_document;
+ } else {
+ this.output_document = document;
+ }
+ this.phase = this.STARTED;
+ };
+
+ Output.prototype.resolve_log = function() {
+ var output_document;
+ if (typeof this.output_document === "function") {
+ output_document = this.output_document.apply(undefined);
+ } else {
+ output_document = this.output_document;
+ }
+ if (!output_document) {
+ return;
+ }
+ var node = output_document.getElementById("log");
+ if (!node) {
+ if (!document.body || document.readyState == "loading") {
+ return;
+ }
+ node = output_document.createElement("div");
+ node.id = "log";
+ output_document.body.appendChild(node);
+ }
+ this.output_document = output_document;
+ this.output_node = node;
+ };
+
+ Output.prototype.show_status = function() {
+ if (this.phase < this.STARTED) {
+ this.init();
+ }
+ if (!this.enabled) {
+ return;
+ }
+ if (this.phase < this.HAVE_RESULTS) {
+ this.resolve_log();
+ this.phase = this.HAVE_RESULTS;
+ }
+ var done_count = tests.tests.length - tests.num_pending;
+ if (this.output_node) {
+ if (done_count < 100 ||
+ (done_count < 1000 && done_count % 100 === 0) ||
+ done_count % 1000 === 0) {
+ this.output_node.textContent = "Running, " +
+ done_count + " complete, " +
+ tests.num_pending + " remain";
+ }
+ }
+ };
+
+ Output.prototype.show_results = function (tests, harness_status) {
+ if (this.phase >= this.COMPLETE) {
+ return;
+ }
+ if (!this.enabled) {
+ return;
+ }
+ if (!this.output_node) {
+ this.resolve_log();
+ }
+ this.phase = this.COMPLETE;
+
+ var log = this.output_node;
+ if (!log) {
+ return;
+ }
+ var output_document = this.output_document;
+
+ while (log.lastChild) {
+ log.removeChild(log.lastChild);
+ }
+
+ var script_prefix = null;
+ var scripts = document.getElementsByTagName("script");
+ for (var i = 0; i < scripts.length; i++) {
+ var src;
+ if (scripts[i].src) {
+ src = scripts[i].src;
+ } else if (scripts[i].href) {
+ //SVG case
+ src = scripts[i].href.baseVal;
+ }
+
+ var matches = src && src.match(/^(.*\/|)testharness\.js$/);
+ if (matches) {
+ script_prefix = matches[1];
+ break;
+ }
+ }
+
+ if (script_prefix !== null) {
+ var stylesheet = output_document.createElementNS(xhtml_ns, "link");
+ stylesheet.setAttribute("rel", "stylesheet");
+ stylesheet.setAttribute("href", script_prefix + "testharness.css");
+ var heads = output_document.getElementsByTagName("head");
+ if (heads.length) {
+ heads[0].appendChild(stylesheet);
+ }
+ }
+
+ var status_text_harness = {};
+ status_text_harness[harness_status.OK] = "OK";
+ status_text_harness[harness_status.ERROR] = "Error";
+ status_text_harness[harness_status.TIMEOUT] = "Timeout";
+
+ var status_text = {};
+ status_text[Test.prototype.PASS] = "Pass";
+ status_text[Test.prototype.FAIL] = "Fail";
+ status_text[Test.prototype.TIMEOUT] = "Timeout";
+ status_text[Test.prototype.NOTRUN] = "Not Run";
+
+ var status_number = {};
+ forEach(tests,
+ function(test) {
+ var status = status_text[test.status];
+ if (status_number.hasOwnProperty(status)) {
+ status_number[status] += 1;
+ } else {
+ status_number[status] = 1;
+ }
+ });
+
+ function status_class(status)
+ {
+ return status.replace(/\s/g, '').toLowerCase();
+ }
+
+ var summary_template = ["section", {"id":"summary"},
+ ["h2", {}, "Summary"],
+ function()
+ {
+
+ var status = status_text_harness[harness_status.status];
+ var rv = [["section", {},
+ ["p", {},
+ "Harness status: ",
+ ["span", {"class":status_class(status)},
+ status
+ ],
+ ]
+ ]];
+
+ if (harness_status.status === harness_status.ERROR) {
+ rv[0].push(["pre", {}, harness_status.message]);
+ }
+ return rv;
+ },
+ ["p", {}, "Found ${num_tests} tests"],
+ function() {
+ var rv = [["div", {}]];
+ var i = 0;
+ while (status_text.hasOwnProperty(i)) {
+ if (status_number.hasOwnProperty(status_text[i])) {
+ var status = status_text[i];
+ rv[0].push(["div", {"class":status_class(status)},
+ ["label", {},
+ ["input", {type:"checkbox", checked:"checked"}],
+ status_number[status] + " " + status]]);
+ }
+ i++;
+ }
+ return rv;
+ },
+ ];
+
+ log.appendChild(render(summary_template, {num_tests:tests.length}, output_document));
+
+ forEach(output_document.querySelectorAll("section#summary label"),
+ function(element)
+ {
+ on_event(element, "click",
+ function(e)
+ {
+ if (output_document.getElementById("results") === null) {
+ e.preventDefault();
+ return;
+ }
+ var result_class = element.parentNode.getAttribute("class");
+ var style_element = output_document.querySelector("style#hide-" + result_class);
+ var input_element = element.querySelector("input");
+ if (!style_element && !input_element.checked) {
+ style_element = output_document.createElementNS(xhtml_ns, "style");
+ style_element.id = "hide-" + result_class;
+ style_element.textContent = "table#results > tbody > tr."+result_class+"{display:none}";
+ output_document.body.appendChild(style_element);
+ } else if (style_element && input_element.checked) {
+ style_element.parentNode.removeChild(style_element);
+ }
+ });
+ });
+
+ // This use of innerHTML plus manual escaping is not recommended in
+ // general, but is necessary here for performance. Using textContent
+ // on each individual <td> adds tens of seconds of execution time for
+ // large test suites (tens of thousands of tests).
+ function escape_html(s)
+ {
+ return s.replace(/\&/g, "&")
+ .replace(/</g, "<")
+ .replace(/"/g, """)
+ .replace(/'/g, "'");
+ }
+
+ function has_assertions()
+ {
+ for (var i = 0; i < tests.length; i++) {
+ if (tests[i].properties.hasOwnProperty("assert")) {
+ return true;
+ }
+ }
+ return false;
+ }
+
+ function get_assertion(test)
+ {
+ if (test.properties.hasOwnProperty("assert")) {
+ if (Array.isArray(test.properties.assert)) {
+ return test.properties.assert.join(' ');
+ }
+ return test.properties.assert;
+ }
+ return '';
+ }
+
+ log.appendChild(document.createElementNS(xhtml_ns, "section"));
+ var assertions = has_assertions();
+ var html = "<h2>Details</h2><table id='results' " + (assertions ? "class='assertions'" : "" ) + ">" +
+ "<thead><tr><th>Result</th><th>Test Name</th>" +
+ (assertions ? "<th>Assertion</th>" : "") +
+ "<th>Message</th></tr></thead>" +
+ "<tbody>";
+ for (var i = 0; i < tests.length; i++) {
+ html += '<tr class="' +
+ escape_html(status_class(status_text[tests[i].status])) +
+ '"><td>' +
+ escape_html(status_text[tests[i].status]) +
+ "</td><td>" +
+ escape_html(tests[i].name) +
+ "</td><td>" +
+ (assertions ? escape_html(get_assertion(tests[i])) + "</td><td>" : "") +
+ escape_html(tests[i].message ? tests[i].message : " ") +
+ "</td></tr>";
+ }
+ html += "</tbody></table>";
+ try {
+ log.lastChild.innerHTML = html;
+ } catch (e) {
+ log.appendChild(document.createElementNS(xhtml_ns, "p"))
+ .textContent = "Setting innerHTML for the log threw an exception.";
+ log.appendChild(document.createElementNS(xhtml_ns, "pre"))
+ .textContent = html;
+ }
+ };
+
+ /*
+ * Template code
+ *
+ * A template is just a javascript structure. An element is represented as:
+ *
+ * [tag_name, {attr_name:attr_value}, child1, child2]
+ *
+ * the children can either be strings (which act like text nodes), other templates or
+ * functions (see below)
+ *
+ * A text node is represented as
+ *
+ * ["{text}", value]
+ *
+ * String values have a simple substitution syntax; ${foo} represents a variable foo.
+ *
+ * It is possible to embed logic in templates by using a function in a place where a
+ * node would usually go. The function must either return part of a template or null.
+ *
+ * In cases where a set of nodes are required as output rather than a single node
+ * with children it is possible to just use a list
+ * [node1, node2, node3]
+ *
+ * Usage:
+ *
+ * render(template, substitutions) - take a template and an object mapping
+ * variable names to parameters and return either a DOM node or a list of DOM nodes
+ *
+ * substitute(template, substitutions) - take a template and variable mapping object,
+ * make the variable substitutions and return the substituted template
+ *
+ */
+
+ function is_single_node(template)
+ {
+ return typeof template[0] === "string";
+ }
+
+ function substitute(template, substitutions)
+ {
+ if (typeof template === "function") {
+ var replacement = template(substitutions);
+ if (!replacement) {
+ return null;
+ }
+
+ return substitute(replacement, substitutions);
+ }
+
+ if (is_single_node(template)) {
+ return substitute_single(template, substitutions);
+ }
+
+ return filter(map(template, function(x) {
+ return substitute(x, substitutions);
+ }), function(x) {return x !== null;});
+ }
+
+ function substitute_single(template, substitutions)
+ {
+ var substitution_re = /\$\{([^ }]*)\}/g;
+
+ function do_substitution(input) {
+ var components = input.split(substitution_re);
+ var rv = [];
+ for (var i = 0; i < components.length; i += 2) {
+ rv.push(components[i]);
+ if (components[i + 1]) {
+ rv.push(String(substitutions[components[i + 1]]));
+ }
+ }
+ return rv;
+ }
+
+ function substitute_attrs(attrs, rv)
+ {
+ rv[1] = {};
+ for (var name in template[1]) {
+ if (attrs.hasOwnProperty(name)) {
+ var new_name = do_substitution(name).join("");
+ var new_value = do_substitution(attrs[name]).join("");
+ rv[1][new_name] = new_value;
+ }
+ }
+ }
+
+ function substitute_children(children, rv)
+ {
+ for (var i = 0; i < children.length; i++) {
+ if (children[i] instanceof Object) {
+ var replacement = substitute(children[i], substitutions);
+ if (replacement !== null) {
+ if (is_single_node(replacement)) {
+ rv.push(replacement);
+ } else {
+ extend(rv, replacement);
+ }
+ }
+ } else {
+ extend(rv, do_substitution(String(children[i])));
+ }
+ }
+ return rv;
+ }
+
+ var rv = [];
+ rv.push(do_substitution(String(template[0])).join(""));
+
+ if (template[0] === "{text}") {
+ substitute_children(template.slice(1), rv);
+ } else {
+ substitute_attrs(template[1], rv);
+ substitute_children(template.slice(2), rv);
+ }
+
+ return rv;
+ }
+
+ function make_dom_single(template, doc)
+ {
+ var output_document = doc || document;
+ var element;
+ if (template[0] === "{text}") {
+ element = output_document.createTextNode("");
+ for (var i = 1; i < template.length; i++) {
+ element.data += template[i];
+ }
+ } else {
+ element = output_document.createElementNS(xhtml_ns, template[0]);
+ for (var name in template[1]) {
+ if (template[1].hasOwnProperty(name)) {
+ element.setAttribute(name, template[1][name]);
+ }
+ }
+ for (var i = 2; i < template.length; i++) {
+ if (template[i] instanceof Object) {
+ var sub_element = make_dom(template[i]);
+ element.appendChild(sub_element);
+ } else {
+ var text_node = output_document.createTextNode(template[i]);
+ element.appendChild(text_node);
+ }
+ }
+ }
+
+ return element;
+ }
+
+ function make_dom(template, substitutions, output_document)
+ {
+ if (is_single_node(template)) {
+ return make_dom_single(template, output_document);
+ }
+
+ return map(template, function(x) {
+ return make_dom_single(x, output_document);
+ });
+ }
+
+ function render(template, substitutions, output_document)
+ {
+ return make_dom(substitute(template, substitutions), output_document);
+ }
+
+ /*
+ * Utility funcions
+ */
+ function assert(expected_true, function_name, description, error, substitutions)
+ {
+ if (tests.tests.length === 0) {
+ tests.set_file_is_test();
+ }
+ if (expected_true !== true) {
+ var msg = make_message(function_name, description,
+ error, substitutions);
+ throw new AssertionError(msg);
+ }
+ }
+
+ function AssertionError(message)
+ {
+ this.message = message;
+ }
+
+ AssertionError.prototype.toString = function() {
+ return this.message;
+ };
+
+ function make_message(function_name, description, error, substitutions)
+ {
+ for (var p in substitutions) {
+ if (substitutions.hasOwnProperty(p)) {
+ substitutions[p] = format_value(substitutions[p]);
+ }
+ }
+ var node_form = substitute(["{text}", "${function_name}: ${description}" + error],
+ merge({function_name:function_name,
+ description:(description?description + " ":"")},
+ substitutions));
+ return node_form.slice(1).join("");
+ }
+
+ function filter(array, callable, thisObj) {
+ var rv = [];
+ for (var i = 0; i < array.length; i++) {
+ if (array.hasOwnProperty(i)) {
+ var pass = callable.call(thisObj, array[i], i, array);
+ if (pass) {
+ rv.push(array[i]);
+ }
+ }
+ }
+ return rv;
+ }
+
+ function map(array, callable, thisObj)
+ {
+ var rv = [];
+ rv.length = array.length;
+ for (var i = 0; i < array.length; i++) {
+ if (array.hasOwnProperty(i)) {
+ rv[i] = callable.call(thisObj, array[i], i, array);
+ }
+ }
+ return rv;
+ }
+
+ function extend(array, items)
+ {
+ Array.prototype.push.apply(array, items);
+ }
+
+ function forEach (array, callback, thisObj)
+ {
+ for (var i = 0; i < array.length; i++) {
+ if (array.hasOwnProperty(i)) {
+ callback.call(thisObj, array[i], i, array);
+ }
+ }
+ }
+
+ function merge(a,b)
+ {
+ var rv = {};
+ var p;
+ for (p in a) {
+ rv[p] = a[p];
+ }
+ for (p in b) {
+ rv[p] = b[p];
+ }
+ return rv;
+ }
+
+ function expose(object, name)
+ {
+ var components = name.split(".");
+ var target = test_environment.global_scope();
+ for (var i = 0; i < components.length - 1; i++) {
+ if (!(components[i] in target)) {
+ target[components[i]] = {};
+ }
+ target = target[components[i]];
+ }
+ target[components[components.length - 1]] = object;
+ }
+
+ function is_same_origin(w) {
+ try {
+ 'random_prop' in w;
+ return true;
+ } catch (e) {
+ return false;
+ }
+ }
+
+ function supports_post_message(w)
+ {
+ var supports;
+ var type;
+ // Given IE implements postMessage across nested iframes but not across
+ // windows or tabs, you can't infer cross-origin communication from the presence
+ // of postMessage on the current window object only.
+ //
+ // Touching the postMessage prop on a window can throw if the window is
+ // not from the same origin AND post message is not supported in that
+ // browser. So just doing an existence test here won't do, you also need
+ // to wrap it in a try..cacth block.
+ try {
+ type = typeof w.postMessage;
+ if (type === "function") {
+ supports = true;
+ }
+
+ // IE8 supports postMessage, but implements it as a host object which
+ // returns "object" as its `typeof`.
+ else if (type === "object") {
+ supports = true;
+ }
+
+ // This is the case where postMessage isn't supported AND accessing a
+ // window property across origins does NOT throw (e.g. old Safari browser).
+ else {
+ supports = false;
+ }
+ } catch (e) {
+ // This is the case where postMessage isn't supported AND accessing a
+ // window property across origins throws (e.g. old Firefox browser).
+ supports = false;
+ }
+ return supports;
+ }
+
+ /**
+ * Setup globals
+ */
+
+ var tests = new Tests();
+
+ addEventListener("error", function(e) {
+ if (tests.file_is_test) {
+ var test = tests.tests[0];
+ if (test.phase >= test.phases.HAS_RESULT) {
+ return;
+ }
+ var message = e.message;
+ test.set_status(test.FAIL, message);
+ test.phase = test.phases.HAS_RESULT;
+ test.done();
+ done();
+ } else if (!tests.allow_uncaught_exception) {
+ tests.status.status = tests.status.ERROR;
+ tests.status.message = e.message;
+ }
+ });
+
+ test_environment.on_tests_ready();
+
+})();
+// vim: set expandtab shiftwidth=4 tabstop=4:
--- /dev/null
+/*global add_completion_callback, setup */
+/*
+ * This file is intended for vendors to implement
+ * code needed to integrate testharness.js tests with their own test systems.
+ *
+ * The default implementation extracts metadata from the tests and validates
+ * it against the cached version that should be present in the test source
+ * file. If the cache is not found or is out of sync, source code suitable for
+ * caching the metadata is optionally generated.
+ *
+ * The cached metadata is present for extraction by test processing tools that
+ * are unable to execute javascript.
+ *
+ * Metadata is attached to tests via the properties parameter in the test
+ * constructor. See testharness.js for details.
+ *
+ * Typically test system integration will attach callbacks when each test has
+ * run, using add_result_callback(callback(test)), or when the whole test file
+ * has completed, using
+ * add_completion_callback(callback(tests, harness_status)).
+ *
+ * For more documentation about the callback functions and the
+ * parameters they are called with see testharness.js
+ */
+
+
+
+var metadata_generator = {
+
+ currentMetadata: {},
+ cachedMetadata: false,
+ metadataProperties: ['help', 'assert', 'author'],
+
+ error: function(message) {
+ var messageElement = document.createElement('p');
+ messageElement.setAttribute('class', 'error');
+ this.appendText(messageElement, message);
+
+ var summary = document.getElementById('summary');
+ if (summary) {
+ summary.parentNode.insertBefore(messageElement, summary);
+ }
+ else {
+ document.body.appendChild(messageElement);
+ }
+ },
+
+ /**
+ * Ensure property value has contact information
+ */
+ validateContact: function(test, propertyName) {
+ var result = true;
+ var value = test.properties[propertyName];
+ var values = Array.isArray(value) ? value : [value];
+ for (var index = 0; index < values.length; index++) {
+ value = values[index];
+ var re = /(\S+)(\s*)<(.*)>(.*)/;
+ if (! re.test(value)) {
+ re = /(\S+)(\s+)(http[s]?:\/\/)(.*)/;
+ if (! re.test(value)) {
+ this.error('Metadata property "' + propertyName +
+ '" for test: "' + test.name +
+ '" must have name and contact information ' +
+ '("name <email>" or "name http(s)://")');
+ result = false;
+ }
+ }
+ }
+ return result;
+ },
+
+ /**
+ * Extract metadata from test object
+ */
+ extractFromTest: function(test) {
+ var testMetadata = {};
+ // filter out metadata from other properties in test
+ for (var metaIndex = 0; metaIndex < this.metadataProperties.length;
+ metaIndex++) {
+ var meta = this.metadataProperties[metaIndex];
+ if (test.properties.hasOwnProperty(meta)) {
+ if ('author' == meta) {
+ this.validateContact(test, meta);
+ }
+ testMetadata[meta] = test.properties[meta];
+ }
+ }
+ return testMetadata;
+ },
+
+ /**
+ * Compare cached metadata to extracted metadata
+ */
+ validateCache: function() {
+ for (var testName in this.currentMetadata) {
+ if (! this.cachedMetadata.hasOwnProperty(testName)) {
+ return false;
+ }
+ var testMetadata = this.currentMetadata[testName];
+ var cachedTestMetadata = this.cachedMetadata[testName];
+ delete this.cachedMetadata[testName];
+
+ for (var metaIndex = 0; metaIndex < this.metadataProperties.length;
+ metaIndex++) {
+ var meta = this.metadataProperties[metaIndex];
+ if (cachedTestMetadata.hasOwnProperty(meta) &&
+ testMetadata.hasOwnProperty(meta)) {
+ if (Array.isArray(cachedTestMetadata[meta])) {
+ if (! Array.isArray(testMetadata[meta])) {
+ return false;
+ }
+ if (cachedTestMetadata[meta].length ==
+ testMetadata[meta].length) {
+ for (var index = 0;
+ index < cachedTestMetadata[meta].length;
+ index++) {
+ if (cachedTestMetadata[meta][index] !=
+ testMetadata[meta][index]) {
+ return false;
+ }
+ }
+ }
+ else {
+ return false;
+ }
+ }
+ else {
+ if (Array.isArray(testMetadata[meta])) {
+ return false;
+ }
+ if (cachedTestMetadata[meta] != testMetadata[meta]) {
+ return false;
+ }
+ }
+ }
+ else if (cachedTestMetadata.hasOwnProperty(meta) ||
+ testMetadata.hasOwnProperty(meta)) {
+ return false;
+ }
+ }
+ }
+ for (var testName in this.cachedMetadata) {
+ return false;
+ }
+ return true;
+ },
+
+ appendText: function(elemement, text) {
+ elemement.appendChild(document.createTextNode(text));
+ },
+
+ jsonifyArray: function(arrayValue, indent) {
+ var output = '[';
+
+ if (1 == arrayValue.length) {
+ output += JSON.stringify(arrayValue[0]);
+ }
+ else {
+ for (var index = 0; index < arrayValue.length; index++) {
+ if (0 < index) {
+ output += ',\n ' + indent;
+ }
+ output += JSON.stringify(arrayValue[index]);
+ }
+ }
+ output += ']';
+ return output;
+ },
+
+ jsonifyObject: function(objectValue, indent) {
+ var output = '{';
+ var value;
+
+ var count = 0;
+ for (var property in objectValue) {
+ ++count;
+ if (Array.isArray(objectValue[property]) ||
+ ('object' == typeof(value))) {
+ ++count;
+ }
+ }
+ if (1 == count) {
+ for (var property in objectValue) {
+ output += ' "' + property + '": ' +
+ JSON.stringify(objectValue[property]) +
+ ' ';
+ }
+ }
+ else {
+ var first = true;
+ for (var property in objectValue) {
+ if (! first) {
+ output += ',';
+ }
+ first = false;
+ output += '\n ' + indent + '"' + property + '": ';
+ value = objectValue[property];
+ if (Array.isArray(value)) {
+ output += this.jsonifyArray(value, indent +
+ ' '.substr(0, 5 + property.length));
+ }
+ else if ('object' == typeof(value)) {
+ output += this.jsonifyObject(value, indent + ' ');
+ }
+ else {
+ output += JSON.stringify(value);
+ }
+ }
+ if (1 < output.length) {
+ output += '\n' + indent;
+ }
+ }
+ output += '}';
+ return output;
+ },
+
+ /**
+ * Generate javascript source code for captured metadata
+ * Metadata is in pretty-printed JSON format
+ */
+ generateSource: function() {
+ var source =
+ '<script id="metadata_cache">/*\n' +
+ this.jsonifyObject(this.currentMetadata, '') + '\n' +
+ '*/</script>\n';
+ return source;
+ },
+
+ /**
+ * Add element containing metadata source code
+ */
+ addSourceElement: function(event) {
+ var sourceWrapper = document.createElement('div');
+ sourceWrapper.setAttribute('id', 'metadata_source');
+
+ var instructions = document.createElement('p');
+ if (this.cachedMetadata) {
+ this.appendText(instructions,
+ 'Replace the existing <script id="metadata_cache"> element ' +
+ 'in the test\'s <head> with the following:');
+ }
+ else {
+ this.appendText(instructions,
+ 'Copy the following into the <head> element of the test ' +
+ 'or the test\'s metadata sidecar file:');
+ }
+ sourceWrapper.appendChild(instructions);
+
+ var sourceElement = document.createElement('pre');
+ this.appendText(sourceElement, this.generateSource());
+
+ sourceWrapper.appendChild(sourceElement);
+
+ var messageElement = document.getElementById('metadata_issue');
+ messageElement.parentNode.insertBefore(sourceWrapper,
+ messageElement.nextSibling);
+ messageElement.parentNode.removeChild(messageElement);
+
+ (event.preventDefault) ? event.preventDefault() :
+ event.returnValue = false;
+ },
+
+ /**
+ * Extract the metadata cache from the cache element if present
+ */
+ getCachedMetadata: function() {
+ var cacheElement = document.getElementById('metadata_cache');
+
+ if (cacheElement) {
+ var cacheText = cacheElement.firstChild.nodeValue;
+ var openBrace = cacheText.indexOf('{');
+ var closeBrace = cacheText.lastIndexOf('}');
+ if ((-1 < openBrace) && (-1 < closeBrace)) {
+ cacheText = cacheText.slice(openBrace, closeBrace + 1);
+ try {
+ this.cachedMetadata = JSON.parse(cacheText);
+ }
+ catch (exc) {
+ this.cachedMetadata = 'Invalid JSON in Cached metadata. ';
+ }
+ }
+ else {
+ this.cachedMetadata = 'Metadata not found in cache element. ';
+ }
+ }
+ },
+
+ /**
+ * Main entry point, extract metadata from tests, compare to cached version
+ * if present.
+ * If cache not present or differs from extrated metadata, generate an error
+ */
+ process: function(tests) {
+ for (var index = 0; index < tests.length; index++) {
+ var test = tests[index];
+ if (this.currentMetadata.hasOwnProperty(test.name)) {
+ this.error('Duplicate test name: ' + test.name);
+ }
+ else {
+ this.currentMetadata[test.name] = this.extractFromTest(test);
+ }
+ }
+
+ this.getCachedMetadata();
+
+ var message = null;
+ var messageClass = 'warning';
+ var showSource = false;
+
+ if (0 === tests.length) {
+ if (this.cachedMetadata) {
+ message = 'Cached metadata present but no tests. ';
+ }
+ }
+ else if (1 === tests.length) {
+ if (this.cachedMetadata) {
+ message = 'Single test files should not have cached metadata. ';
+ }
+ else {
+ var testMetadata = this.currentMetadata[tests[0].name];
+ for (var meta in testMetadata) {
+ if (testMetadata.hasOwnProperty(meta)) {
+ message = 'Single tests should not have metadata. ' +
+ 'Move metadata to <head>. ';
+ break;
+ }
+ }
+ }
+ }
+ else {
+ if (this.cachedMetadata) {
+ messageClass = 'error';
+ if ('string' == typeof(this.cachedMetadata)) {
+ message = this.cachedMetadata;
+ showSource = true;
+ }
+ else if (! this.validateCache()) {
+ message = 'Cached metadata out of sync. ';
+ showSource = true;
+ }
+ }
+ }
+
+ if (message) {
+ var messageElement = document.createElement('p');
+ messageElement.setAttribute('id', 'metadata_issue');
+ messageElement.setAttribute('class', messageClass);
+ this.appendText(messageElement, message);
+
+ if (showSource) {
+ var link = document.createElement('a');
+ this.appendText(link, 'Click for source code.');
+ link.setAttribute('href', '#');
+ link.setAttribute('onclick',
+ 'metadata_generator.addSourceElement(event)');
+ messageElement.appendChild(link);
+ }
+
+ var summary = document.getElementById('summary');
+ if (summary) {
+ summary.parentNode.insertBefore(messageElement, summary);
+ }
+ else {
+ var log = document.getElementById('log');
+ if (log) {
+ log.appendChild(messageElement);
+ }
+ }
+ }
+ },
+
+ setup: function() {
+ add_completion_callback(
+ function (tests, harness_status) {
+ metadata_generator.process(tests, harness_status);
+ });
+ }
+};
+
+metadata_generator.setup();
+
+/* If the parent window has a testharness_properties object,
+ * we use this to provide the test settings. This is used by the
+ * default in-browser runner to configure the timeout and the
+ * rendering of results
+ */
+try {
+ if (window.opener && "testharness_properties" in window.opener) {
+ /* If we pass the testharness_properties object as-is here without
+ * JSON stringifying and reparsing it, IE fails & emits the message
+ * "Could not complete the operation due to error 80700019".
+ */
+ setup(JSON.parse(JSON.stringify(window.opener.testharness_properties)));
+ }
+} catch (e) {
+}
+// vim: set expandtab shiftwidth=4 tabstop=4:
--- /dev/null
+{
+ "pkg-blacklist": [
+ "config.xml",
+ "pack.py",
+ "testcase.xsl",
+ "testresult.xsl",
+ "tests.css",
+ "icon.png",
+ "manifest.json",
+ "suite.json",
+ "inst.*"
+ ],
+ "pkg-list": {
+ "apk,cordova": {
+ "blacklist": [
+ "*"
+ ],
+ "copylist": {
+ "inst.apk.py": "inst.py",
+ "tests.full.xml": "tests.full.xml",
+ "tests.xml": "tests.xml"
+ },
+ "pkg-app": {\r
+ "sign-flag": "true"\r
+ }
+ },
+ "apk-aio, cordova-aio": {
+ "blacklist": []
+ },
+ "wgt": {
+ "blacklist": [
+ "*"
+ ],
+ "copylist": {
+ "inst.wgt.py": "inst.py",
+ "tests.full.xml": "tests.full.xml",
+ "tests.xml": "tests.xml"
+ },
+ "pkg-app": {\r
+ "sign-flag": "true"\r
+ }
+ },
+ "xpk": {
+ "blacklist": [
+ "*"
+ ],
+ "copylist": {
+ "inst.xpk.py": "inst.py",
+ "tests.full.xml": "tests.full.xml",
+ "tests.xml": "tests.xml"
+ },
+ "pkg-app": {
+ "blacklist": [],
+ "sign-flag": "true"
+ }
+ }
+ },
+ "pkg-name": "tct-flexiblebox-css3-tests"
+}
\ No newline at end of file
--- /dev/null
+<?xml version="1.0" encoding="UTF-8"?>
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+ <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
+ <xsl:template match="/">
+ <html>
+ <STYLE type="text/css">
+ @import "tests.css";
+ </STYLE>
+ <head>
+ <script type="text/javascript" src="jquery.min.js"/>
+ </head>
+ <body>
+ <div id="testcasepage">
+ <div id="title">
+ <table>
+ <tr>
+ <td>
+ <h1>Test Cases</h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <div id="suites">
+ <a name="contents"/>
+ <table>
+ <tr>
+ <th>Test Suite</th>
+ <th>Total</th>
+ <th>Auto</th>
+ <th>Manual</th>
+ </tr>
+ <tr>
+ <td>
+ Total
+ </td>
+ <td>
+ <xsl:value-of select="count(test_definition/suite/set//testcase)"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(test_definition/suite/set//testcase[@execution_type = 'auto'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(test_definition/suite/set//testcase[@execution_type != 'auto'])"/>
+ </td>
+ </tr>
+ <xsl:for-each select="test_definition/suite">
+ <tr>
+ <td>
+ <a>
+ <xsl:attribute name="href">
+ #<xsl:value-of select="@name"/>
+ </xsl:attribute>
+ <xsl:value-of select="@name"/>
+ </a>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase)"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set/testcase[@execution_type = 'auto'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set/testcase[@execution_type != 'auto'])"/>
+ </td>
+ </tr>
+ </xsl:for-each>
+ </table>
+ </div>
+ <div id="title">
+ <table>
+ <tr>
+ <td class="title">
+ <h1>Detailed Test Cases</h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <div id="cases">
+ <xsl:for-each select="test_definition/suite">
+ <xsl:sort select="@name"/>
+ <div id="btc">
+ <a href="#contents">Back to Contents</a>
+ </div>
+ <div id="suite_title">
+ Test Suite:
+ <xsl:value-of select="@name"/>
+ <a><xsl:attribute name="name"><xsl:value-of select="@name"/></xsl:attribute></a>
+ </div>
+ <table>
+ <tr>
+ <th>Case_ID</th>
+ <th>Purpose</th>
+ <th>Type</th>
+ <th>Component</th>
+ <th>Execution Type</th>
+ <th>Description</th>
+ <th>Specification</th>
+ </tr>
+ <xsl:for-each select=".//set">
+ <xsl:sort select="@name"/>
+ <tr>
+ <td colspan="7">
+ Test Set:
+ <xsl:value-of select="@name"/>
+ </td>
+ </tr>
+ <xsl:for-each select=".//testcase">
+ <!-- xsl:sort select="@id" /> -->
+ <tr>
+ <td>
+ <xsl:value-of select="@id"/>
+ </td>
+ <td>
+ <xsl:value-of select="@purpose"/>
+ </td>
+ <td>
+ <xsl:value-of select="@type"/>
+ </td>
+ <td>
+ <xsl:value-of select="@component"/>
+ </td>
+ <td>
+ <xsl:value-of select="@execution_type"/>
+ </td>
+ <td>
+ <p>
+ Pre_condition:
+ <xsl:value-of select=".//description/pre_condition"/>
+ </p>
+ <p>
+ Post_condition:
+ <xsl:value-of select=".//description/post_condition"/>
+ </p>
+ <p>
+ Test Script Entry:
+ <xsl:value-of select=".//description/test_script_entry"/>
+ </p>
+ <p>
+ Steps:
+ <p/>
+ <xsl:for-each select=".//description/steps/step"><xsl:sort select="@order"/>
+ Step
+ <xsl:value-of select="@order"/>
+ :
+ <xsl:value-of select="./step_desc"/>
+ ;
+ <p/>
+ Expected Result:
+ <xsl:value-of select="./expected"/>
+ <p/>
+ </xsl:for-each>
+ </p>
+ </td>
+ <td>
+ <xsl:for-each select=".//specs/spec"><b>[Spec_Assertion]:</b><br/>
+ [Category]:
+ <xsl:value-of select="./spec_assertion/@category"/>
+ <br/>
+ [Section]:
+ <xsl:value-of select="./spec_assertion/@section"/>
+ <br/>
+ [Specification]:
+ <xsl:value-of select="./spec_assertion/@specification"/>
+ <br/>
+ [Interface]:
+ <xsl:value-of select="./spec_assertion/@interface"/>
+ <br/>
+ <xsl:choose><xsl:when test="./spec_assertion/@element_name">
+ [<xsl:value-of select="./spec_assertion/@element_type"/>]:
+ <xsl:value-of select="./spec_assertion/@element_name"/>
+ <br/>
+ </xsl:when></xsl:choose>
+ [URL]:
+ <xsl:value-of select="./spec_url"/>
+ <br/>
+ [Statement]:
+ <xsl:value-of select="./spec_statement"/>
+ <br/>
+ </xsl:for-each>
+ </td>
+ </tr>
+ </xsl:for-each>
+ </xsl:for-each>
+ </table>
+ </xsl:for-each>
+ </div>
+ </div>
+ <div id="goTopBtn">
+ <img border="0" src="./back_top.png"/>
+ </div>
+ <script type="text/javascript" src="application.js"/>
+ <script language="javascript" type="text/javascript">
+ $(document).ready(function(){
+ goTopEx();
+ });
+ </script>
+ </body>
+ </html>
+ </xsl:template>
+</xsl:stylesheet>
--- /dev/null
+<?xml version="1.0" encoding="UTF-8"?>
+<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
+ <xsl:output method="html" version="1.0" encoding="UTF-8" indent="yes"/>
+ <xsl:template match="/">
+ <html>
+ <STYLE type="text/css">
+ @import "tests.css";
+ </STYLE>
+ <head>
+ <script type="text/javascript" src="jquery.min.js"/>
+ </head>
+ <body>
+ <div id="testcasepage">
+ <div id="title">
+ <table>
+ <tr>
+ <td>
+ <h1>Test Report</h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <div id="device">
+ <table>
+ <tr>
+ <th colspan="2">Device Information</th>
+ </tr>
+ <tr>
+ <td>Device Name</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@device_name">
+ <xsl:if test="test_definition/environment/@device_name = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@device_name"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Device Model</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@device_model">
+ <xsl:if test="test_definition/environment/@device_model = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@device_model"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>OS Version</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@os_version">
+ <xsl:if test="test_definition/environment/@os_version = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@os_version"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Device ID</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@device_id">
+ <xsl:if test="test_definition/environment/@device_id = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@device_id"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Firmware Version</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@firmware_version">
+ <xsl:if test="test_definition/environment/@firmware_version = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@firmware_version"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Build ID</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@build_id">
+ <xsl:if test="test_definition/environment/@build_id = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@build_id"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Screen Size</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@screen_size">
+ <xsl:if test="test_definition/environment/@screen_size = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@screen_size"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Resolution</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@resolution">
+ <xsl:if test="test_definition/environment/@resolution = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@resolution"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Host Info</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@host">
+ <xsl:if test="test_definition/environment/@host = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@host"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>CTS Version</td>
+ <td>
+ <xsl:choose>
+ <xsl:when test="test_definition/environment/@cts_version">
+ <xsl:if test="test_definition/environment/@cts_version = ''">
+ N/A
+ </xsl:if>
+ <xsl:value-of select="test_definition/environment/@cts_version"/>
+ </xsl:when>
+ <xsl:otherwise>
+ N/A
+ </xsl:otherwise>
+ </xsl:choose>
+ </td>
+ </tr>
+ <tr>
+ <td>Others</td>
+ <td>
+ <xsl:if test="test_definition/environment/other = ''">
+ N/A
+ </xsl:if>
+ <xsl:call-template name="br-replace">
+ <xsl:with-param name="word" select="test_definition/environment/other"/>
+ </xsl:call-template>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <div id="summary">
+ <table>
+ <tr>
+ <th colspan="2">Test Summary</th>
+ </tr>
+ <tr>
+ <td>Test Plan Name</td>
+ <td>
+ <xsl:value-of select="test_definition/summary/@test_plan_name"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Tests Total</td>
+ <td>
+ <xsl:value-of select="count(test_definition//suite/set/testcase)"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Test Passed</td>
+ <td>
+ <xsl:value-of select="count(test_definition//suite/set/testcase[@result = 'PASS'])"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Test Failed</td>
+ <td>
+ <xsl:value-of select="count(test_definition//suite/set/testcase[@result = 'FAIL'])"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Test Block</td>
+ <td>
+ <xsl:value-of select="count(test_definition//suite/set/testcase[@result = 'BLOCK'])"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Test Not Run</td>
+ <td>
+ <xsl:value-of select="count(test_definition//suite/set/testcase) - count(test_definition//suite/set/testcase[@result = 'PASS']) - count(test_definition//suite/set/testcase[@result = 'FAIL']) - count(test_definition//suite/set/testcase[@result = 'BLOCK'])"/>
+ </td>
+ </tr>
+ <tr>
+ <td>Start time</td>
+ <td>
+ <xsl:value-of select="test_definition/summary/start_at"/>
+ </td>
+ </tr>
+ <tr>
+ <td>End time</td>
+ <td>
+ <xsl:value-of select="test_definition/summary/end_at"/>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <div id="suite_summary">
+ <div id="title">
+ <a name="contents"/>
+ <table>
+ <tr>
+ <td class="title">
+ <h1>Test Summary by Suite</h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <table>
+ <tr>
+ <th>Suite</th>
+ <th>Passed</th>
+ <th>Failed</th>
+ <th>Blocked</th>
+ <th>Not Run</th>
+ <th>Total</th>
+ </tr>
+ <xsl:for-each select="test_definition/suite">
+ <xsl:sort select="@name"/>
+ <tr>
+ <td>
+ <a>
+ <xsl:attribute name="href">
+ #<xsl:value-of select="@name"/>
+ </xsl:attribute>
+ <xsl:value-of select="@name"/>
+ </a>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase[@result = 'PASS'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase[@result = 'FAIL'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase[@result = 'BLOCK'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase) - count(set//testcase[@result = 'PASS']) - count(set//testcase[@result = 'FAIL']) - count(set//testcase[@result = 'BLOCK'])"/>
+ </td>
+ <td>
+ <xsl:value-of select="count(set//testcase)"/>
+ </td>
+ </tr>
+ </xsl:for-each>
+ </table>
+ </div>
+ <div id="fail_cases">
+ <div id="title">
+ <table>
+ <tr>
+ <td class="title">
+ <h1 align="center">
+ Test Failures (
+ <xsl:value-of select="count(test_definition/suite/set//testcase[@result = 'FAIL'])"/>
+ )
+ </h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <xsl:for-each select="test_definition/suite">
+ <xsl:sort select="@name"/>
+ <div id="btc">
+ <a href="#contents">Back to Contents</a>
+ </div>
+ <div id="suite_title">
+ Test Suite:
+ <xsl:value-of select="@name"/>
+ <a><xsl:attribute name="name"><xsl:value-of select="@name"/></xsl:attribute></a>
+ </div>
+ <table>
+ <tr>
+ <th>Case_ID</th>
+ <th>Purpose</th>
+ <th>Result</th>
+ <th>Stdout</th>
+ </tr>
+ <xsl:for-each select=".//set">
+ <xsl:sort select="@name"/>
+ <tr>
+ <td colspan="4">
+ Test Set:
+ <xsl:value-of select="@name"/>
+ </td>
+ </tr>
+ <xsl:for-each select=".//testcase">
+ <xsl:sort select="@id"/>
+ <xsl:choose>
+ <xsl:when test="@result">
+ <xsl:if test="@result = 'FAIL'">
+ <tr>
+ <td>
+ <xsl:value-of select="@id"/>
+ </td>
+ <td>
+ <xsl:value-of select="@purpose"/>
+ </td>
+ <td class="red_rate">
+ <xsl:value-of select="@result"/>
+ </td>
+ <td>
+ <xsl:value-of select=".//result_info/stdout"/>
+ <xsl:if test=".//result_info/stdout = ''">
+ N/A
+ </xsl:if>
+ </td>
+ </tr>
+ </xsl:if>
+ </xsl:when>
+ </xsl:choose>
+ </xsl:for-each>
+ </xsl:for-each>
+ </table>
+ </xsl:for-each>
+ </div>
+ <div id="cases">
+ <div id="title">
+ <table>
+ <tr>
+ <td class="title">
+ <h1 align="center">Detailed Test Results</h1>
+ </td>
+ </tr>
+ </table>
+ </div>
+ <xsl:for-each select="test_definition/suite">
+ <xsl:sort select="@name"/>
+ <div id="btc">
+ <a href="#contents">Back to Contents</a>
+ </div>
+ <div id="suite_title">
+ Test Suite:
+ <xsl:value-of select="@name"/>
+ <a><xsl:attribute name="name"><xsl:value-of select="@name"/></xsl:attribute></a>
+ </div>
+ <table>
+ <tr>
+ <th>Case_ID</th>
+ <th>Purpose</th>
+ <th>Result</th>
+ <th>Stdout</th>
+ </tr>
+ <xsl:for-each select=".//set">
+ <xsl:sort select="@name"/>
+ <tr>
+ <td colspan="4">
+ Test Set:
+ <xsl:value-of select="@name"/>
+ </td>
+ </tr>
+ <xsl:for-each select=".//testcase">
+ <xsl:sort select="@id"/>
+ <tr>
+ <td>
+ <xsl:value-of select="@id"/>
+ </td>
+ <td>
+ <xsl:value-of select="@purpose"/>
+ </td>
+ <xsl:choose>
+ <xsl:when test="@result">
+ <xsl:if test="@result = 'FAIL'">
+ <td class="red_rate">
+ <xsl:value-of select="@result"/>
+ </td>
+ </xsl:if>
+ <xsl:if test="@result = 'PASS'">
+ <td class="green_rate">
+ <xsl:value-of select="@result"/>
+ </td>
+ </xsl:if>
+ <xsl:if test="@result = 'BLOCK' ">
+ <td>
+ BLOCK
+ </td>
+ </xsl:if>
+ <xsl:if test="@result != 'BLOCK' and @result != 'FAIL' and @result != 'PASS' ">
+ <td>
+ Not Run
+ </td>
+ </xsl:if>
+ </xsl:when>
+ <xsl:otherwise>
+ <td>
+ </td>
+ </xsl:otherwise>
+ </xsl:choose>
+ <td>
+ <xsl:value-of select=".//result_info/stdout"/>
+ <xsl:if test=".//result_info/stdout = ''">
+ N/A
+ </xsl:if>
+ </td>
+ </tr>
+ </xsl:for-each>
+ </xsl:for-each>
+ </table>
+ </xsl:for-each>
+ </div>
+ </div>
+ <div id="goTopBtn">
+ <img border="0" src="./back_top.png"/>
+ </div>
+ <script type="text/javascript" src="application.js"/>
+ <script language="javascript" type="text/javascript">
+ $(document).ready(function(){
+ goTopEx();
+ });
+ </script>
+ </body>
+ </html>
+ </xsl:template>
+ <xsl:template name="br-replace">
+ <xsl:param name="word"/>
+ <xsl:variable name="cr">
+ <xsl:text>
+ </xsl:text>
+ </xsl:variable>
+ <xsl:choose>
+ <xsl:when test="contains($word,$cr)">
+ <xsl:value-of select="substring-before($word,$cr)"/>
+ <br/>
+ <xsl:call-template name="br-replace">
+ <xsl:with-param name="word" select="substring-after($word,$cr)"/>
+ </xsl:call-template>
+ </xsl:when>
+ <xsl:otherwise>
+ <xsl:value-of select="$word"/>
+ </xsl:otherwise>
+ </xsl:choose>
+ </xsl:template>
+</xsl:stylesheet>
--- /dev/null
+@charset "UTF-8";\r
+/* CSS Document */\r
+#testcasepage div,\r
+#testcasepage h1,\r
+#testcasepage p,\r
+#testcasepage table,\r
+#testcasepage tr,\r
+#testcasepage th,\r
+#testcasepage td {\r
+ margin: 0;\r
+ padding: 0;\r
+ border: 0;\r
+ font-weight: inherit;\r
+ font-style: inherit;\r
+ font-size: 0.96em;\r
+ font-family: arial;\r
+ vertical-align: baseline;\r
+}\r
+\r
+#testcasepage p {\r
+ text-align: left;\r
+}\r
+\r
+#suite_title {\r
+ text-align: left;\r
+}\r
+\r
+#btc {\r
+ text-align: right;\r
+}\r
+\r
+#testcasepage table {\r
+ border-collapse: separate;\r
+ border-spacing: 0;\r
+ margin-bottom: 1.4em;\r
+ vertical-align: middle;\r
+}\r
+\r
+#testcasepage th,\r
+#testcasepage td {\r
+ text-align: left;\r
+ font-weight: normal;\r
+ padding: 4px 10px 4px 5px;\r
+ vertical-align: middle;\r
+}\r
+\r
+#cases table {\r
+ width: 101%;\r
+}\r
+\r
+#fail_cases table {\r
+ width: 101%;\r
+}\r
+\r
+#title table {\r
+ width: 101%;\r
+}\r
+\r
+#device table {\r
+ width: 50%;\r
+}\r
+\r
+#summary table {\r
+ width: 50%;\r
+}\r
+\r
+#testcasepage th {\r
+ border-bottom: 1px solid #000;\r
+ background-color: #AAAAAA;\r
+ border-left: 1px solid #000;\r
+ border-top: 1px solid #000;\r
+ color: #000;\r
+ font-weight: bold;\r
+ vertical-align: bottom;\r
+}\r
+\r
+#testcasepage th:last-child,\r
+#testcasepage td:last-child {\r
+ border-right: 1px solid #000;\r
+}\r
+\r
+#testcasepage td {\r
+ border-left: 1px solid;\r
+ font-weight: normal;\r
+ border-bottom: 1px solid;\r
+}\r
+\r
+#testcasepage td.yellow_rate {\r
+ background-color: #ffcc00;\r
+}\r
+\r
+#testcasepage td.green_rate {\r
+ background-color: #33cc33;\r
+}\r
+\r
+#testcasepage td.dgreen_rate {\r
+ background-color: #339933;\r
+}\r
+\r
+#testcasepage td.red_rate {\r
+ background-color: #FF3333;\r
+}\r
+\r
+#title table,\r
+#title tr,\r
+#title td {\r
+ border-left: none;\r
+ border-bottom: none;\r
+ text-align: center;\r
+}\r
+\r
+#title td:last-child {\r
+ border-right: none;\r
+}\r
+\r
+#testcasepage h1 {\r
+ font-size: 2em;\r
+ font-family: Arial, sans-serif;\r
+ font-weight: bold;\r
+ line-height: 1;\r
+ color: #000;\r
+ margin-bottom: 0.75em;\r
+ padding-top: 0.25em;\r
+ font-weight: bold;\r
+}\r
+\r
+#goTopBtn {\r
+ right: 0px;\r
+ bottom: 0px;\r
+ position: fixed; +position: absolute;\r
+ top: expression(parseInt(document.body.scrollTop) + document.body.clientHeight - 40);\r
+}\r
--- /dev/null
+<?xml version="1.0" encoding="UTF-8"?>
+<?xml-stylesheet type="text/xsl" href="./testcase.xsl"?>
+<test_definition>
+ <suite name="tct-flexiblebox-css3-tests" category="W3C/HTML5 APIs">
+ <set name="FlexibleBox" type="js">
+ <testcase purpose="Check if the 'flex-direction' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P0" id="CSS3FlexBox_flex-direction">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-direction.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex-flow' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P0" id="CSS3FlexBox_flex-flow">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-flow.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex-wrap' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P0" id="CSS3FlexBox_flex-wrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-wrap.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P0" id="CSS3FlexBox_flex">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'align-content' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_align-content">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-content.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'align-items' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_align-items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-items.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'align-self' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_align-self">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-self.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex-basis' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_flex-basis">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-basis.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex-grow' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_flex-grow">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-grow.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'flex-shrink' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_flex-shrink">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-shrink.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'justify-content' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_justify-content">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_justify-content.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'min-height' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_min-height">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_min-height.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="min-height" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#min-size-auto</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'min-width' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_min-width">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_min-width.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="min-width" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#min-size-auto</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the 'order' property exists" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_order">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_order.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, when flex-direction = column. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-direction-column">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-column.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, and main-start and main-end are swapped, when flex-direction = column-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-direction-column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-column-reverse.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode by default. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-direction-default">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-default.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode, when flex-direction = row. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-direction-row">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-row.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex container's main axis has the opposite orientation as the inline axis of the current writing mode, when flex-direction = row-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-direction-row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-row-reverse.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex elements default to flex-wrap: nowrap if flex-wrap is not set. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-wrap-default">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-default.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex elements set to flex-wrap: nowrap will not wrap their flex items. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-wrap-nowrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-nowrap.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex elements wrap left-to-right within their flex container when flex-wrap = 'wrap', matching the writing direction. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-wrap-wrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-wrap.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that flex elements wrap left-to-right and bottom-to-top within their flex container when flex-wrap = 'wrap-reverse'. This assumes writing-direction = horizontal-tb', and direction = 'ltr'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-wrap-wrap-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-wrap-reverse.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that a flex container reverse-wraps blocks multiline in column-reverse direction." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="multi-line-wrap-reverse-column-reverse">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first column; 2-1,2-2 in second column; 3-1 in third column.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-reverse-column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that a flex container reverse-wraps blocks multiline in row-reverse direction." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="multi-line-wrap-reverse-row-reverse">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first row; 2-1,2-2 in second row; 3-1 in third row.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-reverse-row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that a flex container wraps blocks multiline in column-reverse direction." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="multi-line-wrap-with-column-reverse">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first column; 2-1,2-2 in second column; 3-1 in third column.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-with-column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that a flex container wraps blocks multiline in row-reverse direction." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="multi-line-wrap-with-row-reverse">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first row; 2-1,2-2 in second row; 3-1 in third row.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-with-row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test checks that align-items and justify-content properties by default. This assumes align-items = 'center', and justify-content = 'center'." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P2" id="flexbox-flex-layout-center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-layout-center.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>http://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of align-content is stretch" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=1</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of align-items is stretch" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=2</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of align-self is stretch" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=3</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of flex is 0 1 auto" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=4</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of flex-basis is auto" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=5</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of flex-grow is 0" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=6</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of flex-shrink is 1" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_007">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=7</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of justify-content is flex-start" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_008">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=8</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of min-height is 0px" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_009">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=9</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of min-width is 0px" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_010">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=10</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the initial value of order is 0" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="CSS3FlexBox_initial_value_011">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=11</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="CSS Test: Change the value of 'order' property" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="Flexible-order">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/Flexible-order.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: center' centers lines in the flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-001.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: flex-start' packs lines toward the start of the flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-002.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: flex-end' packs lines toward the end of the flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-003.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: space-between' distributes lines evenly in the flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-004.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: space-around' distributes lines evenly in the flex container with half-size spaces on either end" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-005.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a multi-line flex container with 'align-content: stretch' stretches lines to take up the remaining space." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-006.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the align-content value center." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_center.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the align-content value flex-end." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_flex-end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_flex-end.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the align-content value flex-start." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_flex-start">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_flex-start.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify align-content value space-around." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_space-around">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_space-around.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the display can recognize inline-flex value." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_space-between">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_space-between.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the align-content value stretch." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-content_stretch">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_stretch.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'align-items: center' centers each flex item's margin box in the cross-axis of its line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-items-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-001.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'align-items: flex-start' places each flex item's margin box flush with the cross-start edge of line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-items-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-002.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'align-items: flex-end' places each flex item's margin box flush with the cross-end edge of line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-items-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-003.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'align-items: stretch' places each flex item's margin box so that its cross size is the same as the cross size of the line." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-items-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-005.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'flex-start' aligns the flex items to the start edge of cross axis" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'flex-end' aligns the flex items to the end edge of cross axis" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'center' centered the flex items in the cross axis within the line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-003.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'stretch' makes the cross size of the item's margin box as close to the same size as the line as possible" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-004.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'stretch' will be invalid while cross size of the flex item set exact number" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-005.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'baseline' aligns the flex items to the baseline of content" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-006.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'auto' aligns flex items to start edge of cross-axis when 'align-items' set 'flex-start'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-007">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-007.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'auto' aligns flex items to end edge of cross-axis when 'align-items' set 'flex-end'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-008">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-008.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'auto' will center flex items the flex items in the cross axis when 'align-items' set 'center'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-009">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-009.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'auto' aligns the flex items to the baseline of content when 'align-items' set 'baseline'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-010">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-010.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property set 'auto' makes the cross size of the item's margin box as close to the same size as the line as possible when 'align-items' set 'stretch'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-011">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-011.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The initial value of 'align-self' property is 'auto'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-012">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-012.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'align-self' property is invalid if applied to flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="align-self-013">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-013.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-self" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-self</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex box with 'justify-content: flex-end' pack flex items toward the end of the line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="css-box-justify-content">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-box-justify-content.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Items should stretch vertically in all time" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="css-flexbox-height-animation-stretch">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-flexbox-height-animation-stretch.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The image items should expand evenly" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="css-flexbox-img-expand-evenly">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-flexbox-img-expand-evenly.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that an element with 'display' property set to 'flex' establishes a new block-level flex container." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="display-flex-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display-flex-001.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-containers" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-containers</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can indenfy the display value flex." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="display_flex_exist">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display_flex_exist.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-containers" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-containers</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the display value inline-flex." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="display_inline-flex_exist">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display_inline-flex_exist.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex grow factor determines the distribution of positive free space" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-001.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex shrink factor is multiplied by the flex base size when distributing negative space" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-002.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex items with a different flex grow factor have different flexibilities" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-003.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex items with a different flex shrink factor have different flexibilities" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-004.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case tests that flex items center" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-align-items-center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-align-items-center.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test that we compute the correct aspect-ratio based cross size when a width is specified" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-aspect-ratio-img-column-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-column-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test that we compute the correct aspect-ratio based cross size when a height is specified" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-aspect-ratio-img-column-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-column-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Test that we compute the correct aspect-ratio based cross size when a height is specified" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-aspect-ratio-img-row-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-row-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-property" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set positive number, the actual value of test element size is same as the positive number" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property specified correct value, the actual value of test element size is same as to the value of 'flex-basis' property, and the 'width' property is invalid." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set negative number, the tested element is not shown when width not set either." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-003.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set negative number, the actual width of tested element is same as the value of 'width' property specified." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-004.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set '0', the actual width of tested element is same as 0." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-005.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set '0%', the actual width of tested element is same as 0." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-006.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set 'auto', the actual width of tested element same as the value which specified by width property." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-007">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-007.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-basis' property set positive percentage, the actual width of tested element same as the percentage of flex container size." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-basis-008">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-008.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check the margins of adjacent flex items do not collapse." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-container-margin">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-container-margin.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-container" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#auto-margins</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that column-reverse flex-direction swaps the main start and main end directions" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction-column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Changing 'flex-direction' with JavaScript and then changing it back should returns to the original look." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction-modify">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-modify.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the main axis of the row flex-direction has the same orientation as the inline axis of the current writing mode" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction-row">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-row.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that row-reverse flex-direction swaps the main start and main end directions" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction-row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The flex items inserted by script shuould follow the right direction what the flex-direction property directives." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction-with-element-insert">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-with-element-insert.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The flow of flex items in the the flex container should observe the flex-direction property." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the flex-direction value column." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction_column">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_column.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the flex-direction value column-reverse." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction_column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the flex-direction value row." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction_row">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_row.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if the web engine can identify the flex-direction value row-reverse." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-direction_row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row nowrap' controls the flex container is single-line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row wrap' controls the flex container is multi-line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row wrap-reverse' controls the flex container is multi-line but the cross-start and cross-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-003.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row-reverse nowrap' controls the flex container is single-line, but the main-start and main-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-004.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row-reverse wrap' controls the flex container is multi-line but the main-start and main-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-005.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'row-reverse wrap-reverse' controls the flex container is multi-line but the main-start and main-end, cross-start and cross-end directions are all swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-006.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column nowrap' controls the flex container is single-line, but the main axis is vertical" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-007">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-007.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column wrap' controls the flex container is multi-line but the main axis is vertical" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-008">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-008.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the cross-start and cross-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-009">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-009.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column-reverse nowrap' controls the flex container is single-line, but the main axis is vertical, the main-start and main-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-010">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-010.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column-reverse wrap' controls the flex container is multi-line but the main axis is vertical, the main-start and main-end directions are swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-011">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-011.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-flow' property set 'column-reverse wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the 'cross-start/cross-end' and 'main-start/main-end' directions are all swapped" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-flow-012">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-012.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="'flex-grow' property specifies the flex grow factor, which determines how much the flex item will grow relative to the rest of the flex items in the flex container when positive free space is distributed." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-grow-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-001.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-grow' property initial value is '0', the flex item will keep the width when 'flex-grow' set '0'" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-grow-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-grow' property set negative number, the flex item will not grow." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-grow-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-003.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-grow' property is invalid when the flex container has no space distributed." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-grow-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-004.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="The 'flex-grow' property is invalid when the property applied to flex container." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-grow-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-005.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-grow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-grow</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case tests that flex items flexibility" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-items-flexibility">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-items-flexibility.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flexibility" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flexibility</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case tests that flex margin with no collapse" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-margin-no-collapse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-margin-no-collapse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="auto-margins" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#auto-margins</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that minimum height for flex items is the min-content size." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-minimum-height-flex-items-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-001.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that minimum height for flex items is the min-content size (which corresponds to the image size)." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-minimum-height-flex-items-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-004.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that minimum height for flex items is the specified size, as the min-content size of the image corresponds to that." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-minimum-height-flex-items-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-006.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that minimum width for flex items is the specified size if it's smaller than the min-content size." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-minimum-width-flex-items-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-width-flex-items-002.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that minimum width for flex items is the min-content size (which corresponds to the image size)." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-minimum-width-flex-items-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-width-flex-items-004.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that ordered flex items should be ordered properly" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-order">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-order.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'flex-flow: row wrap' is multi-line flex container." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-row-wrap-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-row-wrap-001.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-flow" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-flow-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property set positive number determines how much the flex item will shrink relative to the rest of the flex items in the flex container when negative free space is distributed" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-001.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property set negative is invalid to shrink flex items when negative free space is distributed" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-002.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property initial value is 1" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-003.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property is invalid when flex container has enough space to load flex items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-004.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property set 0 will ignore the flex container" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-005.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex item whose flex-shrink property of set 0 will displayed on the top of all flex items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-006.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that the flex-shrink property applied to flex container is invalid, all flex items will use the default value 1" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-shrink-007">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-007.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-shrink" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-shrink-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks that vertical-align property has no effect" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-vertical-align-effect">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-vertical-align-effect.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-containers" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-containers</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'flex-flow: wrap' is a multi-line flex container." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-wrap-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap-001.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks if the web engine can identify the flex-wrap value nowrap." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-wrap_nowrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_nowrap.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks if the display can recognize inline-flex value." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-wrap_wrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_wrap.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This case checks if the web engine can identify the flex-wrap value wrap-reverse." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flex-wrap_wrap-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_wrap-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="CSS Flexbox Test: flex-wrap flexes widths after line breaking" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox-flex-wrap-flexing">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-flexing.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that a flex container layous out its content starting with the lowest numbered ordinal group and going up" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox-order-from-lowest">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-order-from-lowest.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test check that the order property has no effect on elements that are not flex items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox-order-only-flexitems">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-order-only-flexitems.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if flex:auto - no flex:auto set for 1 item in line 1, and another item in line 2" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox_flex-auto-notallitems-bothlines">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-bothlines.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if flex:auto - one item in line 1 doesn't have that flex:auto set" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox_flex-auto-notallitems-firstline">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-firstline.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if flex:auto - no flex:auto set for item on 2nd line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox_flex-auto-notallitems-secondline">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-secondline.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if flex:auto - applying to all items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox_flex-auto">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="Check if flex:auto with order - applying to all items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexbox_flex-order">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-order.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="float has no effect on flex items" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="flexible-box-float">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexible-box-float.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'justify-content: center' centers flex items in the main axis of each line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-001.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'justify-content: flex-start' packs flex items toward the start of the main axis of each line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content-002">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-002.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'justify-content: flex-end' packs flex items toward the end of the main axis of each line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content-003">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-003.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'justify-content: space-between' evenly distributes flex items in the main axis of each line" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-004.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that the flex container with 'justify-content: space-around' evenly distributes flex items in the main axis of each line with half-size spaces on either end" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-005.htm</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can identify the justify-content value center." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content_center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_center.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can indentify the justify-content value flex-end." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content_flex-end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_flex-end.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can indentify the justify-content value flex-start." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content_flex-start">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_flex-start.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can indentify the justy-content value space-around." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content_space-around">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_space-around.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can indentify the justify-content value space-between." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="justify-content_space-between">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_space-between.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="justify-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#justify-content</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that a flex container will lay out its content in the order specified by the ordinal groups." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="order-001">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-001.xht</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="CSS Test: flex container layout lowest order with column-reverse direction" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="order-with-column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-with-column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="CSS Test: flex container layout lowest order with row-reverse direction" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="order-with-row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-with-row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks if the web engine can indentify order property." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="order_value">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order_value.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario4." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="percentage-heights-004">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=4</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario5." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="percentage-heights-005">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=5</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario6." type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" priority="P1" id="percentage-heights-006">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=6</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-items" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-items</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks align-content property - center" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-align-content-center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-center.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks align-content property - flex-end" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-align-content-end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-end.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks align-content property - space-around" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-align-content-space-around">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-space-around.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks align-content property - space-between" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-align-content-space-between">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-space-between.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks align-content property - flex-start" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-align-content-start">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-start.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="align-content" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#align-content-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks display proprety - flex" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-base">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-base.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-basis" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-basis-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks flex-direction proprety - column" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-direction-column">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-column.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks flex-direction proprety - column-reverse" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-direction-column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-column-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks flex-direction proprety - row-reverse" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-direction-row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-row-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-direction" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-direction-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks display proprety - inline-flex" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-inline">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-inline.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="display" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#display-inline-flex</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks order proprety - value" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-order">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-order.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="order" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#order</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks flex-wrap proprety - wrap" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-wrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-wrap.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ <testcase purpose="This test checks flex-wrap proprety - wrap-reverse" type="compliance" status="approved" component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" priority="P1" id="ttwf-reftest-flex-wrap-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-wrap-reverse.html</test_script_entry>
+ </description>
+ <specs>
+ <spec>
+ <spec_assertion element_type="property" element_name="flex-wrap" interface="CSS" specification="CSS Flexible Box Layout Module (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
+ <spec_url>https://www.w3.org/TR/2012/WD-css3-flexbox-20120612/#flex-wrap-property</spec_url>
+ <spec_statement/>
+ </spec>
+ </specs>
+ </testcase>
+ </set>
+ </suite>
+</test_definition>
--- /dev/null
+<?xml version="1.0" encoding="UTF-8"?>
+<?xml-stylesheet type="text/xsl" href="./testcase.xsl"?>
+<test_definition>
+ <suite name="tct-flexiblebox-css3-tests" category="W3C/HTML5 APIs">
+ <set name="FlexibleBox" type="js">
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-direction" priority="P0" purpose="Check if the 'flex-direction' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-direction.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-flow" priority="P0" purpose="Check if the 'flex-flow' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-flow.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-wrap" priority="P0" purpose="Check if the 'flex-wrap' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-wrap.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex" priority="P0" purpose="Check if the 'flex' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_align-content" priority="P1" purpose="Check if the 'align-content' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-content.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_align-items" priority="P1" purpose="Check if the 'align-items' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-items.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_align-self" priority="P1" purpose="Check if the 'align-self' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_align-self.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-basis" priority="P1" purpose="Check if the 'flex-basis' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-basis.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-grow" priority="P1" purpose="Check if the 'flex-grow' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-grow.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_flex-shrink" priority="P1" purpose="Check if the 'flex-shrink' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_flex-shrink.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_justify-content" priority="P1" purpose="Check if the 'justify-content' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_justify-content.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_min-height" priority="P1" purpose="Check if the 'min-height' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_min-height.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_min-width" priority="P1" purpose="Check if the 'min-width' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_min-width.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_order" priority="P1" purpose="Check if the 'order' property exists">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_order.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-direction-column" priority="P2" purpose="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, when flex-direction = column. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-column.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-direction-column-reverse" priority="P2" purpose="Test checks that flex container's main axis has the same orientation as the block axis of the current writing mode, and main-start and main-end are swapped, when flex-direction = column-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-column-reverse.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-direction-default" priority="P2" purpose="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode by default. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-default.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-direction-row" priority="P2" purpose="Test checks that flex container's main axis has the same orientation as the inline axis of the current writing mode, when flex-direction = row. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-row.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-direction-row-reverse" priority="P2" purpose="Test checks that flex container's main axis has the opposite orientation as the inline axis of the current writing mode, when flex-direction = row-reverse. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-direction-row-reverse.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-wrap-default" priority="P2" purpose="Test checks that flex elements default to flex-wrap: nowrap if flex-wrap is not set. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-default.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-wrap-nowrap" priority="P2" purpose="Test checks that flex elements set to flex-wrap: nowrap will not wrap their flex items. With wrapping disabled, the .green flex item should extend outside the bounds of its container, as it is set to flex:none.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-nowrap.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-wrap-wrap" priority="P2" purpose="Test checks that flex elements wrap left-to-right within their flex container when flex-wrap = 'wrap', matching the writing direction. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-wrap.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-wrap-wrap-reverse" priority="P2" purpose="Test checks that flex elements wrap left-to-right and bottom-to-top within their flex container when flex-wrap = 'wrap-reverse'. This assumes writing-direction = horizontal-tb', and direction = 'ltr'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-wrap-reverse.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="multi-line-wrap-reverse-column-reverse" priority="P2" purpose="This test check that a flex container reverse-wraps blocks multiline in column-reverse direction.">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first column; 2-1,2-2 in second column; 3-1 in third column.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-reverse-column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="multi-line-wrap-reverse-row-reverse" priority="P2" purpose="This test check that a flex container reverse-wraps blocks multiline in row-reverse direction.">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first row; 2-1,2-2 in second row; 3-1 in third row.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-reverse-row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="multi-line-wrap-with-column-reverse" priority="P2" purpose="This test check that a flex container wraps blocks multiline in column-reverse direction.">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first column; 2-1,2-2 in second column; 3-1 in third column.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-with-column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="multi-line-wrap-with-row-reverse" priority="P2" purpose="This test check that a flex container wraps blocks multiline in row-reverse direction.">
+ <description>
+ <steps>
+ <step order="1">
+ <step_desc>Run the test</step_desc>
+ <expected>1-1,1-2,1-3 in first row; 2-1,2-2 in second row; 3-1 in third row.</expected>
+ </step>
+ </steps>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/multi-line-wrap-with-row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-layout-center" priority="P2" purpose="Test checks that align-items and justify-content properties by default. This assumes align-items = 'center', and justify-content = 'center'.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-layout-center.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_001" priority="P1" purpose="Check if the initial value of align-content is stretch">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=1</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_002" priority="P1" purpose="Check if the initial value of align-items is stretch">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=2</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_003" priority="P1" purpose="Check if the initial value of align-self is stretch">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=3</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_004" priority="P1" purpose="Check if the initial value of flex is 0 1 auto">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=4</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_005" priority="P1" purpose="Check if the initial value of flex-basis is auto">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=5</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_006" priority="P1" purpose="Check if the initial value of flex-grow is 0">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=6</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_007" priority="P1" purpose="Check if the initial value of flex-shrink is 1">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=7</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_008" priority="P1" purpose="Check if the initial value of justify-content is flex-start">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=8</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_009" priority="P1" purpose="Check if the initial value of min-height is 0px">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=9</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_010" priority="P1" purpose="Check if the initial value of min-width is 0px">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=10</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="CSS3FlexBox_initial_value_011" priority="P1" purpose="Check if the initial value of order is 0">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/CSS3FlexBox_initial_value.html?total_num=11&amp;locator_key=id&amp;value=11</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="Flexible-order" priority="P1" purpose="CSS Test: Change the value of 'order' property">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/Flexible-order.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-001" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: center' centers lines in the flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-001.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-002" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: flex-start' packs lines toward the start of the flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-002.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-003" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: flex-end' packs lines toward the end of the flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-003.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-004" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: space-between' distributes lines evenly in the flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-004.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-005" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: space-around' distributes lines evenly in the flex container with half-size spaces on either end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-005.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content-006" priority="P1" purpose="This test checks that a multi-line flex container with 'align-content: stretch' stretches lines to take up the remaining space.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content-006.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_center" priority="P1" purpose="Check if the web engine can identify the align-content value center.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_center.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_flex-end" priority="P1" purpose="Check if the web engine can identify the align-content value flex-end.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_flex-end.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_flex-start" priority="P1" purpose="Check if the web engine can identify the align-content value flex-start.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_flex-start.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_space-around" priority="P1" purpose="Check if the web engine can identify align-content value space-around.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_space-around.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_space-between" priority="P1" purpose="Check if the display can recognize inline-flex value.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_space-between.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-content_stretch" priority="P1" purpose="Check if the web engine can identify the align-content value stretch.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-content_stretch.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-items-001" priority="P1" purpose="This test checks that the flex container with 'align-items: center' centers each flex item's margin box in the cross-axis of its line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-001.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-items-002" priority="P1" purpose="This test checks that the flex container with 'align-items: flex-start' places each flex item's margin box flush with the cross-start edge of line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-002.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-items-003" priority="P1" purpose="This test checks that the flex container with 'align-items: flex-end' places each flex item's margin box flush with the cross-end edge of line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-003.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-items-005" priority="P1" purpose="This test checks that the flex container with 'align-items: stretch' places each flex item's margin box so that its cross size is the same as the cross size of the line.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-items-005.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-001" priority="P1" purpose="The 'align-self' property set 'flex-start' aligns the flex items to the start edge of cross axis">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-002" priority="P1" purpose="The 'align-self' property set 'flex-end' aligns the flex items to the end edge of cross axis">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-003" priority="P1" purpose="The 'align-self' property set 'center' centered the flex items in the cross axis within the line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-003.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-004" priority="P1" purpose="The 'align-self' property set 'stretch' makes the cross size of the item's margin box as close to the same size as the line as possible">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-004.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-005" priority="P1" purpose="The 'align-self' property set 'stretch' will be invalid while cross size of the flex item set exact number">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-005.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-006" priority="P1" purpose="The 'align-self' property set 'baseline' aligns the flex items to the baseline of content">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-006.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-007" priority="P1" purpose="The 'align-self' property set 'auto' aligns flex items to start edge of cross-axis when 'align-items' set 'flex-start'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-007.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-008" priority="P1" purpose="The 'align-self' property set 'auto' aligns flex items to end edge of cross-axis when 'align-items' set 'flex-end'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-008.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-009" priority="P1" purpose="The 'align-self' property set 'auto' will center flex items the flex items in the cross axis when 'align-items' set 'center'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-009.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-010" priority="P1" purpose="The 'align-self' property set 'auto' aligns the flex items to the baseline of content when 'align-items' set 'baseline'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-010.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-011" priority="P1" purpose="The 'align-self' property set 'auto' makes the cross size of the item's margin box as close to the same size as the line as possible when 'align-items' set 'stretch'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-011.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-012" priority="P1" purpose="The initial value of 'align-self' property is 'auto'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-012.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="align-self-013" priority="P1" purpose="The 'align-self' property is invalid if applied to flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/align-self-013.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="css-box-justify-content" priority="P1" purpose="This test checks that the flex box with 'justify-content: flex-end' pack flex items toward the end of the line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-box-justify-content.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="css-flexbox-height-animation-stretch" priority="P1" purpose="Items should stretch vertically in all time">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-flexbox-height-animation-stretch.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="css-flexbox-img-expand-evenly" priority="P1" purpose="The image items should expand evenly">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/css-flexbox-img-expand-evenly.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="display-flex-001" priority="P1" purpose="This test checks that an element with 'display' property set to 'flex' establishes a new block-level flex container.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display-flex-001.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="display_flex_exist" priority="P1" purpose="Check if the web engine can indenfy the display value flex.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display_flex_exist.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="display_inline-flex_exist" priority="P1" purpose="Check if the web engine can identify the display value inline-flex.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/display_inline-flex_exist.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-001" priority="P1" purpose="This test checks that the flex grow factor determines the distribution of positive free space">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-001.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-002" priority="P1" purpose="This test checks that the flex shrink factor is multiplied by the flex base size when distributing negative space">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-002.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-003" priority="P1" purpose="This test checks that the flex items with a different flex grow factor have different flexibilities">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-003.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-004" priority="P1" purpose="This test checks that the flex items with a different flex shrink factor have different flexibilities">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-004.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-align-items-center" priority="P1" purpose="This case tests that flex items center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-align-items-center.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-aspect-ratio-img-column-001" priority="P1" purpose="Test that we compute the correct aspect-ratio based cross size when a width is specified">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-column-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-aspect-ratio-img-column-002" priority="P1" purpose="Test that we compute the correct aspect-ratio based cross size when a height is specified">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-column-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-aspect-ratio-img-row-001" priority="P1" purpose="Test that we compute the correct aspect-ratio based cross size when a height is specified">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-aspect-ratio-img-row-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-001" priority="P1" purpose="The 'flex-basis' property set positive number, the actual value of test element size is same as the positive number">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-002" priority="P1" purpose="The 'flex-basis' property specified correct value, the actual value of test element size is same as to the value of 'flex-basis' property, and the 'width' property is invalid.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-003" priority="P1" purpose="The 'flex-basis' property set negative number, the tested element is not shown when width not set either.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-003.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-004" priority="P1" purpose="The 'flex-basis' property set negative number, the actual width of tested element is same as the value of 'width' property specified.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-004.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-005" priority="P1" purpose="The 'flex-basis' property set '0', the actual width of tested element is same as 0.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-005.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-006" priority="P1" purpose="The 'flex-basis' property set '0%', the actual width of tested element is same as 0.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-006.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-007" priority="P1" purpose="The 'flex-basis' property set 'auto', the actual width of tested element same as the value which specified by width property.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-007.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-basis-008" priority="P1" purpose="The 'flex-basis' property set positive percentage, the actual width of tested element same as the percentage of flex container size.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-basis-008.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-container-margin" priority="P1" purpose="This test check the margins of adjacent flex items do not collapse.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-container-margin.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction-column-reverse" priority="P1" purpose="This test checks that column-reverse flex-direction swaps the main start and main end directions">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction-modify" priority="P1" purpose="Changing 'flex-direction' with JavaScript and then changing it back should returns to the original look.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-modify.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction-row" priority="P1" purpose="This test checks that the main axis of the row flex-direction has the same orientation as the inline axis of the current writing mode">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-row.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction-row-reverse" priority="P1" purpose="This test checks that row-reverse flex-direction swaps the main start and main end directions">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction-with-element-insert" priority="P1" purpose="The flex items inserted by script shuould follow the right direction what the flex-direction property directives.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction-with-element-insert.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction" priority="P1" purpose="The flow of flex items in the the flex container should observe the flex-direction property.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction_column" priority="P1" purpose="Check if the web engine can identify the flex-direction value column.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_column.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction_column-reverse" priority="P1" purpose="Check if the web engine can identify the flex-direction value column-reverse.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction_row" priority="P1" purpose="Check if the web engine can identify the flex-direction value row.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_row.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-direction_row-reverse" priority="P1" purpose="Check if the web engine can identify the flex-direction value row-reverse.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-direction_row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-001" priority="P1" purpose="The 'flex-flow' property set 'row nowrap' controls the flex container is single-line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-002" priority="P1" purpose="The 'flex-flow' property set 'row wrap' controls the flex container is multi-line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-003" priority="P1" purpose="The 'flex-flow' property set 'row wrap-reverse' controls the flex container is multi-line but the cross-start and cross-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-003.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-004" priority="P1" purpose="The 'flex-flow' property set 'row-reverse nowrap' controls the flex container is single-line, but the main-start and main-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-004.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-005" priority="P1" purpose="The 'flex-flow' property set 'row-reverse wrap' controls the flex container is multi-line but the main-start and main-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-005.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-006" priority="P1" purpose="The 'flex-flow' property set 'row-reverse wrap-reverse' controls the flex container is multi-line but the main-start and main-end, cross-start and cross-end directions are all swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-006.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-007" priority="P1" purpose="The 'flex-flow' property set 'column nowrap' controls the flex container is single-line, but the main axis is vertical">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-007.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-008" priority="P1" purpose="The 'flex-flow' property set 'column wrap' controls the flex container is multi-line but the main axis is vertical">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-008.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-009" priority="P1" purpose="The 'flex-flow' property set 'column wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the cross-start and cross-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-009.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-010" priority="P1" purpose="The 'flex-flow' property set 'column-reverse nowrap' controls the flex container is single-line, but the main axis is vertical, the main-start and main-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-010.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-011" priority="P1" purpose="The 'flex-flow' property set 'column-reverse wrap' controls the flex container is multi-line but the main axis is vertical, the main-start and main-end directions are swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-011.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-flow-012" priority="P1" purpose="The 'flex-flow' property set 'column-reverse wrap-reverse' controls the flex container is multi-line but the main axis is vertical, the 'cross-start/cross-end' and 'main-start/main-end' directions are all swapped">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-flow-012.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-grow-001" priority="P1" purpose="'flex-grow' property specifies the flex grow factor, which determines how much the flex item will grow relative to the rest of the flex items in the flex container when positive free space is distributed.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-001.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-grow-002" priority="P1" purpose="The 'flex-grow' property initial value is '0', the flex item will keep the width when 'flex-grow' set '0'">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-grow-003" priority="P1" purpose="The 'flex-grow' property set negative number, the flex item will not grow.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-003.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-grow-004" priority="P1" purpose="The 'flex-grow' property is invalid when the flex container has no space distributed.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-004.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-grow-005" priority="P1" purpose="The 'flex-grow' property is invalid when the property applied to flex container.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-grow-005.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-items-flexibility" priority="P1" purpose="This case tests that flex items flexibility">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-items-flexibility.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-margin-no-collapse" priority="P1" purpose="This case tests that flex margin with no collapse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-margin-no-collapse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-minimum-height-flex-items-001" priority="P1" purpose="This case checks that minimum height for flex items is the min-content size.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-001.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-minimum-height-flex-items-004" priority="P1" purpose="This case checks that minimum height for flex items is the min-content size (which corresponds to the image size).">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-004.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-minimum-height-flex-items-006" priority="P1" purpose="This case checks that minimum height for flex items is the specified size, as the min-content size of the image corresponds to that.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-height-flex-items-006.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-minimum-width-flex-items-002" priority="P1" purpose="This case checks that minimum width for flex items is the specified size if it's smaller than the min-content size.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-width-flex-items-002.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-minimum-width-flex-items-004" priority="P1" purpose="This case checks that minimum width for flex items is the min-content size (which corresponds to the image size).">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-minimum-width-flex-items-004.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-order" priority="P1" purpose="This case checks that ordered flex items should be ordered properly">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-order.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-row-wrap-001" priority="P1" purpose="This test checks that the flex container with 'flex-flow: row wrap' is multi-line flex container.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-row-wrap-001.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-001" priority="P1" purpose="This case checks that the flex-shrink property set positive number determines how much the flex item will shrink relative to the rest of the flex items in the flex container when negative free space is distributed">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-001.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-002" priority="P1" purpose="This case checks that the flex-shrink property set negative is invalid to shrink flex items when negative free space is distributed">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-002.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-003" priority="P1" purpose="This case checks that the flex-shrink property initial value is 1">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-003.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-004" priority="P1" purpose="This case checks that the flex-shrink property is invalid when flex container has enough space to load flex items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-004.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-005" priority="P1" purpose="This case checks that the flex-shrink property set 0 will ignore the flex container">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-005.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-006" priority="P1" purpose="This case checks that the flex item whose flex-shrink property of set 0 will displayed on the top of all flex items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-006.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-shrink-007" priority="P1" purpose="This case checks that the flex-shrink property applied to flex container is invalid, all flex items will use the default value 1">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-shrink-007.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-vertical-align-effect" priority="P1" purpose="This case checks that vertical-align property has no effect">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-vertical-align-effect.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-wrap-001" priority="P1" purpose="This test checks that the flex container with 'flex-flow: wrap' is a multi-line flex container.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap-001.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-wrap_nowrap" priority="P1" purpose="This case checks if the web engine can identify the flex-wrap value nowrap.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_nowrap.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-wrap_wrap" priority="P1" purpose="This case checks if the display can recognize inline-flex value.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_wrap.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flex-wrap_wrap-reverse" priority="P1" purpose="This case checks if the web engine can identify the flex-wrap value wrap-reverse.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flex-wrap_wrap-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-flex-wrap-flexing" priority="P1" purpose="CSS Flexbox Test: flex-wrap flexes widths after line breaking">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-flex-wrap-flexing.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-order-from-lowest" priority="P1" purpose="This test check that a flex container layous out its content starting with the lowest numbered ordinal group and going up">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-order-from-lowest.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox-order-only-flexitems" priority="P1" purpose="This test check that the order property has no effect on elements that are not flex items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox-order-only-flexitems.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox_flex-auto-notallitems-bothlines" priority="P1" purpose="Check if flex:auto - no flex:auto set for 1 item in line 1, and another item in line 2">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-bothlines.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox_flex-auto-notallitems-firstline" priority="P1" purpose="Check if flex:auto - one item in line 1 doesn't have that flex:auto set">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-firstline.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox_flex-auto-notallitems-secondline" priority="P1" purpose="Check if flex:auto - no flex:auto set for item on 2nd line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto-notallitems-secondline.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox_flex-auto" priority="P1" purpose="Check if flex:auto - applying to all items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-auto.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexbox_flex-order" priority="P1" purpose="Check if flex:auto with order - applying to all items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexbox_flex-order.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="flexible-box-float" priority="P1" purpose="float has no effect on flex items">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/flexible-box-float.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content-001" priority="P1" purpose="This test checks that the flex container with 'justify-content: center' centers flex items in the main axis of each line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-001.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content-002" priority="P1" purpose="This test checks that the flex container with 'justify-content: flex-start' packs flex items toward the start of the main axis of each line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-002.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content-003" priority="P1" purpose="This test checks that the flex container with 'justify-content: flex-end' packs flex items toward the end of the main axis of each line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-003.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content-004" priority="P1" purpose="This test checks that the flex container with 'justify-content: space-between' evenly distributes flex items in the main axis of each line">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-004.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content-005" priority="P1" purpose="This test checks that the flex container with 'justify-content: space-around' evenly distributes flex items in the main axis of each line with half-size spaces on either end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content-005.htm</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content_center" priority="P1" purpose="This test checks if the web engine can identify the justify-content value center.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_center.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content_flex-end" priority="P1" purpose="This test checks if the web engine can indentify the justify-content value flex-end.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_flex-end.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content_flex-start" priority="P1" purpose="This test checks if the web engine can indentify the justify-content value flex-start.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_flex-start.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content_space-around" priority="P1" purpose="This test checks if the web engine can indentify the justy-content value space-around.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_space-around.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="justify-content_space-between" priority="P1" purpose="This test checks if the web engine can indentify the justify-content value space-between.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/justify-content_space-between.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="order-001" priority="P1" purpose="This test checks that a flex container will lay out its content in the order specified by the ordinal groups.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-001.xht</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="order-with-column-reverse" priority="P1" purpose="CSS Test: flex container layout lowest order with column-reverse direction">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-with-column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="order-with-row-reverse" priority="P1" purpose="CSS Test: flex container layout lowest order with row-reverse direction">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order-with-row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="order_value" priority="P1" purpose="This test checks if the web engine can indentify order property.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/order_value.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="percentage-heights-004" priority="P1" purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario4.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=4</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="percentage-heights-005" priority="P1" purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario5.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=5</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="auto" id="percentage-heights-006" priority="P1" purpose="This test checks that percentage heights on a flex item correctly resolve against the container - scenario6.">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/percentage-heights-000.html?total_num=6&amp;locator_key=id&amp;value=6</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-align-content-center" priority="P1" purpose="This test checks align-content property - center">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-center.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-align-content-end" priority="P1" purpose="This test checks align-content property - flex-end">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-end.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-align-content-space-around" priority="P1" purpose="This test checks align-content property - space-around">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-space-around.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-align-content-space-between" priority="P1" purpose="This test checks align-content property - space-between">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-space-between.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-align-content-start" priority="P1" purpose="This test checks align-content property - flex-start">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-align-content-start.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-base" priority="P1" purpose="This test checks display proprety - flex">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-base.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-direction-column" priority="P1" purpose="This test checks flex-direction proprety - column">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-column.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-direction-column-reverse" priority="P1" purpose="This test checks flex-direction proprety - column-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-column-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-direction-row-reverse" priority="P1" purpose="This test checks flex-direction proprety - row-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-direction-row-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-inline" priority="P1" purpose="This test checks display proprety - inline-flex">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-inline.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-order" priority="P1" purpose="This test checks order proprety - value">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-order.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-wrap" priority="P1" purpose="This test checks flex-wrap proprety - wrap">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-wrap.html</test_script_entry>
+ </description>
+ </testcase>
+ <testcase component="W3C_HTML5 APIs/DOM, Forms and Styles/CSS Flexible Box Layout Module (Partial)" execution_type="manual" id="ttwf-reftest-flex-wrap-reverse" priority="P1" purpose="This test checks flex-wrap proprety - wrap-reverse">
+ <description>
+ <test_script_entry>/opt/tct-flexiblebox-css3-tests/flexiblebox/csswg/ttwf-reftest-flex-wrap-reverse.html</test_script_entry>
+ </description>
+ </testcase>
+ </set>
+ </suite>
+</test_definition>
--- /dev/null
+<!doctype html>
+<!--
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ Wang, Jing <jing.j.wang@intel.com>
+
+-->
+
+<head>
+<meta name="viewport" content="width=device-width">
+<script src="jquery-1.10.2.min.js"></script>
+<style type="text/css">
+html {
+ font-family:DejaVu Sans, Bitstream Vera Sans, Arial, Sans;
+}
+
+body {
+ background-color: white;
+}
+
+table#browse {
+ border-collapse:collapse;
+ table-layout:fixed;width:85%;
+}
+
+table#browse th:first-child,table#browse td:first-child {width:35%;}
+
+table#browse th:last-child,table#browse td:last-child {width:25%;}
+
+table#browse th {
+ padding:0;
+ padding-bottom:0.5em;
+ text-align:left;
+ border-bottom:medium solid black;
+}
+table#browse td {
+ padding:1em;
+ padding-bottom:0.5em;
+ border-bottom:thin solid black;
+}
+div#navbar{
+ box-sizing: border-box;
+ width: 99%;
+ border: 0px;
+ text-align: left;
+ background: slateblue;
+ color: white;
+}
+div#footbar{
+ width: 99%;
+ border: 0px;
+ text-align: left;
+}
+textarea#testinfo{
+ width: 99%;
+ font-size: 0.8em;
+}
+input{
+ font-size: 1.2em;
+ padding-top: 0.1em;
+ padding-bottom: 0.1em;
+}
+
+#btnPrev,#btnNext{
+ width: 8%;
+}
+#btnExit,#btnRun,#btnSave,#btnBack,#btnPass,#btnFail,#btnBlock{
+ width: 16%;
+ font-weight: bold;
+}
+
+#btnPass { color: green;}
+#btnFail { color: red;}
+#btnBlock { color: orange;}
+#labBatch{ font-size: 0.5em;}
+#textTest { width: 53%; }
+#title { font-size: 1.4em; font-weight: bold;}
+#frmTest { border: none;}
+.listhide { display: none;}
+.short{
+ padding-left: 1em;
+}
+</style>
+</head>
+
+<body>
+<div id="navbar" class="batchhide">
+ <span class="short listhide suitehide"><input type="button" id="btnBack" value="Back"/></span>
+ <span class="short listhide suitehide">
+ <input type="button" id="btnPrev" value="<"/>
+ <input type="text" id="textTest" readonly />
+ <input type="button" id="btnNext" value=">"/>
+ </span>
+ <span class="short tchide"> <input type="button" id="btnExit" value="Exit"/></span>
+ <span id="title" class="short tchide">Open Web Test</span>
+</div>
+<div id="divSum"> </div>
+<div width="99%" class="batchhide">
+ <textarea class="listhide suitehide" id="testinfo" rows=4 disabled>
+ </textarea>
+</div>
+<div id="footbar" class="batchhide">
+ <span class="short"><input type="button" id="btnRun" value="Run"/></span>
+ <span class="short listhide tchide"><input type="button" id="btnSave" value="Save"/></span>
+ <span class="short listhide suitehide"><input type="button" id="btnPass" value="PASS"/></span>
+ <span class="short listhide suitehide"><input type="button" id="btnFail" value="FAIL"/></span>
+ <span class="short listhide suitehide"><input type="button" id="btnBlock" value="BLOCK"/></span>
+</div>
+<iframe width="100%" id="frmTest" allowFullScreen="true" mozAllowFullScreen="true" webkitAllowFullscreen="true" src="">
+</iframe>
+<script src="testrunner.js"> </script>
+</body>
+</html>
--- /dev/null
+/*! jQuery v1.10.2 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license
+//@ sourceMappingURL=jquery-1.10.2.min.map
+*/
+(function(e,t){var n,r,i=typeof t,o=e.location,a=e.document,s=a.documentElement,l=e.jQuery,u=e.$,c={},p=[],f="1.10.2",d=p.concat,h=p.push,g=p.slice,m=p.indexOf,y=c.toString,v=c.hasOwnProperty,b=f.trim,x=function(e,t){return new x.fn.init(e,t,r)},w=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,T=/\S+/g,C=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,N=/^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]*))$/,k=/^<(\w+)\s*\/?>(?:<\/\1>|)$/,E=/^[\],:{}\s]*$/,S=/(?:^|:|,)(?:\s*\[)+/g,A=/\\(?:["\\\/bfnrt]|u[\da-fA-F]{4})/g,j=/"[^"\\\r\n]*"|true|false|null|-?(?:\d+\.|)\d+(?:[eE][+-]?\d+|)/g,D=/^-ms-/,L=/-([\da-z])/gi,H=function(e,t){return t.toUpperCase()},q=function(e){(a.addEventListener||"load"===e.type||"complete"===a.readyState)&&(_(),x.ready())},_=function(){a.addEventListener?(a.removeEventListener("DOMContentLoaded",q,!1),e.removeEventListener("load",q,!1)):(a.detachEvent("onreadystatechange",q),e.detachEvent("onload",q))};x.fn=x.prototype={jquery:f,constructor:x,init:function(e,n,r){var i,o;if(!e)return this;if("string"==typeof e){if(i="<"===e.charAt(0)&&">"===e.charAt(e.length-1)&&e.length>=3?[null,e,null]:N.exec(e),!i||!i[1]&&n)return!n||n.jquery?(n||r).find(e):this.constructor(n).find(e);if(i[1]){if(n=n instanceof x?n[0]:n,x.merge(this,x.parseHTML(i[1],n&&n.nodeType?n.ownerDocument||n:a,!0)),k.test(i[1])&&x.isPlainObject(n))for(i in n)x.isFunction(this[i])?this[i](n[i]):this.attr(i,n[i]);return this}if(o=a.getElementById(i[2]),o&&o.parentNode){if(o.id!==i[2])return r.find(e);this.length=1,this[0]=o}return this.context=a,this.selector=e,this}return e.nodeType?(this.context=this[0]=e,this.length=1,this):x.isFunction(e)?r.ready(e):(e.selector!==t&&(this.selector=e.selector,this.context=e.context),x.makeArray(e,this))},selector:"",length:0,toArray:function(){return g.call(this)},get:function(e){return null==e?this.toArray():0>e?this[this.length+e]:this[e]},pushStack:function(e){var t=x.merge(this.constructor(),e);return t.prevObject=this,t.context=this.context,t},each:function(e,t){return x.each(this,e,t)},ready:function(e){return x.ready.promise().done(e),this},slice:function(){return this.pushStack(g.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(e){var t=this.length,n=+e+(0>e?t:0);return this.pushStack(n>=0&&t>n?[this[n]]:[])},map:function(e){return this.pushStack(x.map(this,function(t,n){return e.call(t,n,t)}))},end:function(){return this.prevObject||this.constructor(null)},push:h,sort:[].sort,splice:[].splice},x.fn.init.prototype=x.fn,x.extend=x.fn.extend=function(){var e,n,r,i,o,a,s=arguments[0]||{},l=1,u=arguments.length,c=!1;for("boolean"==typeof s&&(c=s,s=arguments[1]||{},l=2),"object"==typeof s||x.isFunction(s)||(s={}),u===l&&(s=this,--l);u>l;l++)if(null!=(o=arguments[l]))for(i in o)e=s[i],r=o[i],s!==r&&(c&&r&&(x.isPlainObject(r)||(n=x.isArray(r)))?(n?(n=!1,a=e&&x.isArray(e)?e:[]):a=e&&x.isPlainObject(e)?e:{},s[i]=x.extend(c,a,r)):r!==t&&(s[i]=r));return s},x.extend({expando:"jQuery"+(f+Math.random()).replace(/\D/g,""),noConflict:function(t){return e.$===x&&(e.$=u),t&&e.jQuery===x&&(e.jQuery=l),x},isReady:!1,readyWait:1,holdReady:function(e){e?x.readyWait++:x.ready(!0)},ready:function(e){if(e===!0?!--x.readyWait:!x.isReady){if(!a.body)return setTimeout(x.ready);x.isReady=!0,e!==!0&&--x.readyWait>0||(n.resolveWith(a,[x]),x.fn.trigger&&x(a).trigger("ready").off("ready"))}},isFunction:function(e){return"function"===x.type(e)},isArray:Array.isArray||function(e){return"array"===x.type(e)},isWindow:function(e){return null!=e&&e==e.window},isNumeric:function(e){return!isNaN(parseFloat(e))&&isFinite(e)},type:function(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?c[y.call(e)]||"object":typeof e},isPlainObject:function(e){var n;if(!e||"object"!==x.type(e)||e.nodeType||x.isWindow(e))return!1;try{if(e.constructor&&!v.call(e,"constructor")&&!v.call(e.constructor.prototype,"isPrototypeOf"))return!1}catch(r){return!1}if(x.support.ownLast)for(n in e)return v.call(e,n);for(n in e);return n===t||v.call(e,n)},isEmptyObject:function(e){var t;for(t in e)return!1;return!0},error:function(e){throw Error(e)},parseHTML:function(e,t,n){if(!e||"string"!=typeof e)return null;"boolean"==typeof t&&(n=t,t=!1),t=t||a;var r=k.exec(e),i=!n&&[];return r?[t.createElement(r[1])]:(r=x.buildFragment([e],t,i),i&&x(i).remove(),x.merge([],r.childNodes))},parseJSON:function(n){return e.JSON&&e.JSON.parse?e.JSON.parse(n):null===n?n:"string"==typeof n&&(n=x.trim(n),n&&E.test(n.replace(A,"@").replace(j,"]").replace(S,"")))?Function("return "+n)():(x.error("Invalid JSON: "+n),t)},parseXML:function(n){var r,i;if(!n||"string"!=typeof n)return null;try{e.DOMParser?(i=new DOMParser,r=i.parseFromString(n,"text/xml")):(r=new ActiveXObject("Microsoft.XMLDOM"),r.async="false",r.loadXML(n))}catch(o){r=t}return r&&r.documentElement&&!r.getElementsByTagName("parsererror").length||x.error("Invalid XML: "+n),r},noop:function(){},globalEval:function(t){t&&x.trim(t)&&(e.execScript||function(t){e.eval.call(e,t)})(t)},camelCase:function(e){return e.replace(D,"ms-").replace(L,H)},nodeName:function(e,t){return e.nodeName&&e.nodeName.toLowerCase()===t.toLowerCase()},each:function(e,t,n){var r,i=0,o=e.length,a=M(e);if(n){if(a){for(;o>i;i++)if(r=t.apply(e[i],n),r===!1)break}else for(i in e)if(r=t.apply(e[i],n),r===!1)break}else if(a){for(;o>i;i++)if(r=t.call(e[i],i,e[i]),r===!1)break}else for(i in e)if(r=t.call(e[i],i,e[i]),r===!1)break;return e},trim:b&&!b.call("\ufeff\u00a0")?function(e){return null==e?"":b.call(e)}:function(e){return null==e?"":(e+"").replace(C,"")},makeArray:function(e,t){var n=t||[];return null!=e&&(M(Object(e))?x.merge(n,"string"==typeof e?[e]:e):h.call(n,e)),n},inArray:function(e,t,n){var r;if(t){if(m)return m.call(t,e,n);for(r=t.length,n=n?0>n?Math.max(0,r+n):n:0;r>n;n++)if(n in t&&t[n]===e)return n}return-1},merge:function(e,n){var r=n.length,i=e.length,o=0;if("number"==typeof r)for(;r>o;o++)e[i++]=n[o];else while(n[o]!==t)e[i++]=n[o++];return e.length=i,e},grep:function(e,t,n){var r,i=[],o=0,a=e.length;for(n=!!n;a>o;o++)r=!!t(e[o],o),n!==r&&i.push(e[o]);return i},map:function(e,t,n){var r,i=0,o=e.length,a=M(e),s=[];if(a)for(;o>i;i++)r=t(e[i],i,n),null!=r&&(s[s.length]=r);else for(i in e)r=t(e[i],i,n),null!=r&&(s[s.length]=r);return d.apply([],s)},guid:1,proxy:function(e,n){var r,i,o;return"string"==typeof n&&(o=e[n],n=e,e=o),x.isFunction(e)?(r=g.call(arguments,2),i=function(){return e.apply(n||this,r.concat(g.call(arguments)))},i.guid=e.guid=e.guid||x.guid++,i):t},access:function(e,n,r,i,o,a,s){var l=0,u=e.length,c=null==r;if("object"===x.type(r)){o=!0;for(l in r)x.access(e,n,l,r[l],!0,a,s)}else if(i!==t&&(o=!0,x.isFunction(i)||(s=!0),c&&(s?(n.call(e,i),n=null):(c=n,n=function(e,t,n){return c.call(x(e),n)})),n))for(;u>l;l++)n(e[l],r,s?i:i.call(e[l],l,n(e[l],r)));return o?e:c?n.call(e):u?n(e[0],r):a},now:function(){return(new Date).getTime()},swap:function(e,t,n,r){var i,o,a={};for(o in t)a[o]=e.style[o],e.style[o]=t[o];i=n.apply(e,r||[]);for(o in t)e.style[o]=a[o];return i}}),x.ready.promise=function(t){if(!n)if(n=x.Deferred(),"complete"===a.readyState)setTimeout(x.ready);else if(a.addEventListener)a.addEventListener("DOMContentLoaded",q,!1),e.addEventListener("load",q,!1);else{a.attachEvent("onreadystatechange",q),e.attachEvent("onload",q);var r=!1;try{r=null==e.frameElement&&a.documentElement}catch(i){}r&&r.doScroll&&function o(){if(!x.isReady){try{r.doScroll("left")}catch(e){return setTimeout(o,50)}_(),x.ready()}}()}return n.promise(t)},x.each("Boolean Number String Function Array Date RegExp Object Error".split(" "),function(e,t){c["[object "+t+"]"]=t.toLowerCase()});function M(e){var t=e.length,n=x.type(e);return x.isWindow(e)?!1:1===e.nodeType&&t?!0:"array"===n||"function"!==n&&(0===t||"number"==typeof t&&t>0&&t-1 in e)}r=x(a),function(e,t){var n,r,i,o,a,s,l,u,c,p,f,d,h,g,m,y,v,b="sizzle"+-new Date,w=e.document,T=0,C=0,N=st(),k=st(),E=st(),S=!1,A=function(e,t){return e===t?(S=!0,0):0},j=typeof t,D=1<<31,L={}.hasOwnProperty,H=[],q=H.pop,_=H.push,M=H.push,O=H.slice,F=H.indexOf||function(e){var t=0,n=this.length;for(;n>t;t++)if(this[t]===e)return t;return-1},B="checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",P="[\\x20\\t\\r\\n\\f]",R="(?:\\\\.|[\\w-]|[^\\x00-\\xa0])+",W=R.replace("w","w#"),$="\\["+P+"*("+R+")"+P+"*(?:([*^$|!~]?=)"+P+"*(?:(['\"])((?:\\\\.|[^\\\\])*?)\\3|("+W+")|)|)"+P+"*\\]",I=":("+R+")(?:\\(((['\"])((?:\\\\.|[^\\\\])*?)\\3|((?:\\\\.|[^\\\\()[\\]]|"+$.replace(3,8)+")*)|.*)\\)|)",z=RegExp("^"+P+"+|((?:^|[^\\\\])(?:\\\\.)*)"+P+"+$","g"),X=RegExp("^"+P+"*,"+P+"*"),U=RegExp("^"+P+"*([>+~]|"+P+")"+P+"*"),V=RegExp(P+"*[+~]"),Y=RegExp("="+P+"*([^\\]'\"]*)"+P+"*\\]","g"),J=RegExp(I),G=RegExp("^"+W+"$"),Q={ID:RegExp("^#("+R+")"),CLASS:RegExp("^\\.("+R+")"),TAG:RegExp("^("+R.replace("w","w*")+")"),ATTR:RegExp("^"+$),PSEUDO:RegExp("^"+I),CHILD:RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+P+"*(even|odd|(([+-]|)(\\d*)n|)"+P+"*(?:([+-]|)"+P+"*(\\d+)|))"+P+"*\\)|)","i"),bool:RegExp("^(?:"+B+")$","i"),needsContext:RegExp("^"+P+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+P+"*((?:-\\d)?\\d*)"+P+"*\\)|)(?=[^-]|$)","i")},K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,et=/^(?:input|select|textarea|button)$/i,tt=/^h\d$/i,nt=/'|\\/g,rt=RegExp("\\\\([\\da-f]{1,6}"+P+"?|("+P+")|.)","ig"),it=function(e,t,n){var r="0x"+t-65536;return r!==r||n?t:0>r?String.fromCharCode(r+65536):String.fromCharCode(55296|r>>10,56320|1023&r)};try{M.apply(H=O.call(w.childNodes),w.childNodes),H[w.childNodes.length].nodeType}catch(ot){M={apply:H.length?function(e,t){_.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function at(e,t,n,i){var o,a,s,l,u,c,d,m,y,x;if((t?t.ownerDocument||t:w)!==f&&p(t),t=t||f,n=n||[],!e||"string"!=typeof e)return n;if(1!==(l=t.nodeType)&&9!==l)return[];if(h&&!i){if(o=Z.exec(e))if(s=o[1]){if(9===l){if(a=t.getElementById(s),!a||!a.parentNode)return n;if(a.id===s)return n.push(a),n}else if(t.ownerDocument&&(a=t.ownerDocument.getElementById(s))&&v(t,a)&&a.id===s)return n.push(a),n}else{if(o[2])return M.apply(n,t.getElementsByTagName(e)),n;if((s=o[3])&&r.getElementsByClassName&&t.getElementsByClassName)return M.apply(n,t.getElementsByClassName(s)),n}if(r.qsa&&(!g||!g.test(e))){if(m=d=b,y=t,x=9===l&&e,1===l&&"object"!==t.nodeName.toLowerCase()){c=mt(e),(d=t.getAttribute("id"))?m=d.replace(nt,"\\$&"):t.setAttribute("id",m),m="[id='"+m+"'] ",u=c.length;while(u--)c[u]=m+yt(c[u]);y=V.test(e)&&t.parentNode||t,x=c.join(",")}if(x)try{return M.apply(n,y.querySelectorAll(x)),n}catch(T){}finally{d||t.removeAttribute("id")}}}return kt(e.replace(z,"$1"),t,n,i)}function st(){var e=[];function t(n,r){return e.push(n+=" ")>o.cacheLength&&delete t[e.shift()],t[n]=r}return t}function lt(e){return e[b]=!0,e}function ut(e){var t=f.createElement("div");try{return!!e(t)}catch(n){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function ct(e,t){var n=e.split("|"),r=e.length;while(r--)o.attrHandle[n[r]]=t}function pt(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&(~t.sourceIndex||D)-(~e.sourceIndex||D);if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function ft(e){return function(t){var n=t.nodeName.toLowerCase();return"input"===n&&t.type===e}}function dt(e){return function(t){var n=t.nodeName.toLowerCase();return("input"===n||"button"===n)&&t.type===e}}function ht(e){return lt(function(t){return t=+t,lt(function(n,r){var i,o=e([],n.length,t),a=o.length;while(a--)n[i=o[a]]&&(n[i]=!(r[i]=n[i]))})})}s=at.isXML=function(e){var t=e&&(e.ownerDocument||e).documentElement;return t?"HTML"!==t.nodeName:!1},r=at.support={},p=at.setDocument=function(e){var n=e?e.ownerDocument||e:w,i=n.defaultView;return n!==f&&9===n.nodeType&&n.documentElement?(f=n,d=n.documentElement,h=!s(n),i&&i.attachEvent&&i!==i.top&&i.attachEvent("onbeforeunload",function(){p()}),r.attributes=ut(function(e){return e.className="i",!e.getAttribute("className")}),r.getElementsByTagName=ut(function(e){return e.appendChild(n.createComment("")),!e.getElementsByTagName("*").length}),r.getElementsByClassName=ut(function(e){return e.innerHTML="<div class='a'></div><div class='a i'></div>",e.firstChild.className="i",2===e.getElementsByClassName("i").length}),r.getById=ut(function(e){return d.appendChild(e).id=b,!n.getElementsByName||!n.getElementsByName(b).length}),r.getById?(o.find.ID=function(e,t){if(typeof t.getElementById!==j&&h){var n=t.getElementById(e);return n&&n.parentNode?[n]:[]}},o.filter.ID=function(e){var t=e.replace(rt,it);return function(e){return e.getAttribute("id")===t}}):(delete o.find.ID,o.filter.ID=function(e){var t=e.replace(rt,it);return function(e){var n=typeof e.getAttributeNode!==j&&e.getAttributeNode("id");return n&&n.value===t}}),o.find.TAG=r.getElementsByTagName?function(e,n){return typeof n.getElementsByTagName!==j?n.getElementsByTagName(e):t}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},o.find.CLASS=r.getElementsByClassName&&function(e,n){return typeof n.getElementsByClassName!==j&&h?n.getElementsByClassName(e):t},m=[],g=[],(r.qsa=K.test(n.querySelectorAll))&&(ut(function(e){e.innerHTML="<select><option selected=''></option></select>",e.querySelectorAll("[selected]").length||g.push("\\["+P+"*(?:value|"+B+")"),e.querySelectorAll(":checked").length||g.push(":checked")}),ut(function(e){var t=n.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("t",""),e.querySelectorAll("[t^='']").length&&g.push("[*^$]="+P+"*(?:''|\"\")"),e.querySelectorAll(":enabled").length||g.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),g.push(",.*:")})),(r.matchesSelector=K.test(y=d.webkitMatchesSelector||d.mozMatchesSelector||d.oMatchesSelector||d.msMatchesSelector))&&ut(function(e){r.disconnectedMatch=y.call(e,"div"),y.call(e,"[s!='']:x"),m.push("!=",I)}),g=g.length&&RegExp(g.join("|")),m=m.length&&RegExp(m.join("|")),v=K.test(d.contains)||d.compareDocumentPosition?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},A=d.compareDocumentPosition?function(e,t){if(e===t)return S=!0,0;var i=t.compareDocumentPosition&&e.compareDocumentPosition&&e.compareDocumentPosition(t);return i?1&i||!r.sortDetached&&t.compareDocumentPosition(e)===i?e===n||v(w,e)?-1:t===n||v(w,t)?1:c?F.call(c,e)-F.call(c,t):0:4&i?-1:1:e.compareDocumentPosition?-1:1}:function(e,t){var r,i=0,o=e.parentNode,a=t.parentNode,s=[e],l=[t];if(e===t)return S=!0,0;if(!o||!a)return e===n?-1:t===n?1:o?-1:a?1:c?F.call(c,e)-F.call(c,t):0;if(o===a)return pt(e,t);r=e;while(r=r.parentNode)s.unshift(r);r=t;while(r=r.parentNode)l.unshift(r);while(s[i]===l[i])i++;return i?pt(s[i],l[i]):s[i]===w?-1:l[i]===w?1:0},n):f},at.matches=function(e,t){return at(e,null,null,t)},at.matchesSelector=function(e,t){if((e.ownerDocument||e)!==f&&p(e),t=t.replace(Y,"='$1']"),!(!r.matchesSelector||!h||m&&m.test(t)||g&&g.test(t)))try{var n=y.call(e,t);if(n||r.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(i){}return at(t,f,null,[e]).length>0},at.contains=function(e,t){return(e.ownerDocument||e)!==f&&p(e),v(e,t)},at.attr=function(e,n){(e.ownerDocument||e)!==f&&p(e);var i=o.attrHandle[n.toLowerCase()],a=i&&L.call(o.attrHandle,n.toLowerCase())?i(e,n,!h):t;return a===t?r.attributes||!h?e.getAttribute(n):(a=e.getAttributeNode(n))&&a.specified?a.value:null:a},at.error=function(e){throw Error("Syntax error, unrecognized expression: "+e)},at.uniqueSort=function(e){var t,n=[],i=0,o=0;if(S=!r.detectDuplicates,c=!r.sortStable&&e.slice(0),e.sort(A),S){while(t=e[o++])t===e[o]&&(i=n.push(o));while(i--)e.splice(n[i],1)}return e},a=at.getText=function(e){var t,n="",r=0,i=e.nodeType;if(i){if(1===i||9===i||11===i){if("string"==typeof e.textContent)return e.textContent;for(e=e.firstChild;e;e=e.nextSibling)n+=a(e)}else if(3===i||4===i)return e.nodeValue}else for(;t=e[r];r++)n+=a(t);return n},o=at.selectors={cacheLength:50,createPseudo:lt,match:Q,attrHandle:{},find:{},relative:{">":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(rt,it),e[3]=(e[4]||e[5]||"").replace(rt,it),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||at.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&at.error(e[0]),e},PSEUDO:function(e){var n,r=!e[5]&&e[2];return Q.CHILD.test(e[0])?null:(e[3]&&e[4]!==t?e[2]=e[4]:r&&J.test(r)&&(n=mt(r,!0))&&(n=r.indexOf(")",r.length-n)-r.length)&&(e[0]=e[0].slice(0,n),e[2]=r.slice(0,n)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(rt,it).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=N[e+" "];return t||(t=RegExp("(^|"+P+")"+e+"("+P+"|$)"))&&N(e,function(e){return t.test("string"==typeof e.className&&e.className||typeof e.getAttribute!==j&&e.getAttribute("class")||"")})},ATTR:function(e,t,n){return function(r){var i=at.attr(r,e);return null==i?"!="===t:t?(i+="","="===t?i===n:"!="===t?i!==n:"^="===t?n&&0===i.indexOf(n):"*="===t?n&&i.indexOf(n)>-1:"$="===t?n&&i.slice(-n.length)===n:"~="===t?(" "+i+" ").indexOf(n)>-1:"|="===t?i===n||i.slice(0,n.length+1)===n+"-":!1):!0}},CHILD:function(e,t,n,r,i){var o="nth"!==e.slice(0,3),a="last"!==e.slice(-4),s="of-type"===t;return 1===r&&0===i?function(e){return!!e.parentNode}:function(t,n,l){var u,c,p,f,d,h,g=o!==a?"nextSibling":"previousSibling",m=t.parentNode,y=s&&t.nodeName.toLowerCase(),v=!l&&!s;if(m){if(o){while(g){p=t;while(p=p[g])if(s?p.nodeName.toLowerCase()===y:1===p.nodeType)return!1;h=g="only"===e&&!h&&"nextSibling"}return!0}if(h=[a?m.firstChild:m.lastChild],a&&v){c=m[b]||(m[b]={}),u=c[e]||[],d=u[0]===T&&u[1],f=u[0]===T&&u[2],p=d&&m.childNodes[d];while(p=++d&&p&&p[g]||(f=d=0)||h.pop())if(1===p.nodeType&&++f&&p===t){c[e]=[T,d,f];break}}else if(v&&(u=(t[b]||(t[b]={}))[e])&&u[0]===T)f=u[1];else while(p=++d&&p&&p[g]||(f=d=0)||h.pop())if((s?p.nodeName.toLowerCase()===y:1===p.nodeType)&&++f&&(v&&((p[b]||(p[b]={}))[e]=[T,f]),p===t))break;return f-=i,f===r||0===f%r&&f/r>=0}}},PSEUDO:function(e,t){var n,r=o.pseudos[e]||o.setFilters[e.toLowerCase()]||at.error("unsupported pseudo: "+e);return r[b]?r(t):r.length>1?(n=[e,e,"",t],o.setFilters.hasOwnProperty(e.toLowerCase())?lt(function(e,n){var i,o=r(e,t),a=o.length;while(a--)i=F.call(e,o[a]),e[i]=!(n[i]=o[a])}):function(e){return r(e,0,n)}):r}},pseudos:{not:lt(function(e){var t=[],n=[],r=l(e.replace(z,"$1"));return r[b]?lt(function(e,t,n,i){var o,a=r(e,null,i,[]),s=e.length;while(s--)(o=a[s])&&(e[s]=!(t[s]=o))}):function(e,i,o){return t[0]=e,r(t,null,o,n),!n.pop()}}),has:lt(function(e){return function(t){return at(e,t).length>0}}),contains:lt(function(e){return function(t){return(t.textContent||t.innerText||a(t)).indexOf(e)>-1}}),lang:lt(function(e){return G.test(e||"")||at.error("unsupported lang: "+e),e=e.replace(rt,it).toLowerCase(),function(t){var n;do if(n=h?t.lang:t.getAttribute("xml:lang")||t.getAttribute("lang"))return n=n.toLowerCase(),n===e||0===n.indexOf(e+"-");while((t=t.parentNode)&&1===t.nodeType);return!1}}),target:function(t){var n=e.location&&e.location.hash;return n&&n.slice(1)===t.id},root:function(e){return e===d},focus:function(e){return e===f.activeElement&&(!f.hasFocus||f.hasFocus())&&!!(e.type||e.href||~e.tabIndex)},enabled:function(e){return e.disabled===!1},disabled:function(e){return e.disabled===!0},checked:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&!!e.checked||"option"===t&&!!e.selected},selected:function(e){return e.parentNode&&e.parentNode.selectedIndex,e.selected===!0},empty:function(e){for(e=e.firstChild;e;e=e.nextSibling)if(e.nodeName>"@"||3===e.nodeType||4===e.nodeType)return!1;return!0},parent:function(e){return!o.pseudos.empty(e)},header:function(e){return tt.test(e.nodeName)},input:function(e){return et.test(e.nodeName)},button:function(e){var t=e.nodeName.toLowerCase();return"input"===t&&"button"===e.type||"button"===t},text:function(e){var t;return"input"===e.nodeName.toLowerCase()&&"text"===e.type&&(null==(t=e.getAttribute("type"))||t.toLowerCase()===e.type)},first:ht(function(){return[0]}),last:ht(function(e,t){return[t-1]}),eq:ht(function(e,t,n){return[0>n?n+t:n]}),even:ht(function(e,t){var n=0;for(;t>n;n+=2)e.push(n);return e}),odd:ht(function(e,t){var n=1;for(;t>n;n+=2)e.push(n);return e}),lt:ht(function(e,t,n){var r=0>n?n+t:n;for(;--r>=0;)e.push(r);return e}),gt:ht(function(e,t,n){var r=0>n?n+t:n;for(;t>++r;)e.push(r);return e})}},o.pseudos.nth=o.pseudos.eq;for(n in{radio:!0,checkbox:!0,file:!0,password:!0,image:!0})o.pseudos[n]=ft(n);for(n in{submit:!0,reset:!0})o.pseudos[n]=dt(n);function gt(){}gt.prototype=o.filters=o.pseudos,o.setFilters=new gt;function mt(e,t){var n,r,i,a,s,l,u,c=k[e+" "];if(c)return t?0:c.slice(0);s=e,l=[],u=o.preFilter;while(s){(!n||(r=X.exec(s)))&&(r&&(s=s.slice(r[0].length)||s),l.push(i=[])),n=!1,(r=U.exec(s))&&(n=r.shift(),i.push({value:n,type:r[0].replace(z," ")}),s=s.slice(n.length));for(a in o.filter)!(r=Q[a].exec(s))||u[a]&&!(r=u[a](r))||(n=r.shift(),i.push({value:n,type:a,matches:r}),s=s.slice(n.length));if(!n)break}return t?s.length:s?at.error(e):k(e,l).slice(0)}function yt(e){var t=0,n=e.length,r="";for(;n>t;t++)r+=e[t].value;return r}function vt(e,t,n){var r=t.dir,o=n&&"parentNode"===r,a=C++;return t.first?function(t,n,i){while(t=t[r])if(1===t.nodeType||o)return e(t,n,i)}:function(t,n,s){var l,u,c,p=T+" "+a;if(s){while(t=t[r])if((1===t.nodeType||o)&&e(t,n,s))return!0}else while(t=t[r])if(1===t.nodeType||o)if(c=t[b]||(t[b]={}),(u=c[r])&&u[0]===p){if((l=u[1])===!0||l===i)return l===!0}else if(u=c[r]=[p],u[1]=e(t,n,s)||i,u[1]===!0)return!0}}function bt(e){return e.length>1?function(t,n,r){var i=e.length;while(i--)if(!e[i](t,n,r))return!1;return!0}:e[0]}function xt(e,t,n,r,i){var o,a=[],s=0,l=e.length,u=null!=t;for(;l>s;s++)(o=e[s])&&(!n||n(o,r,i))&&(a.push(o),u&&t.push(s));return a}function wt(e,t,n,r,i,o){return r&&!r[b]&&(r=wt(r)),i&&!i[b]&&(i=wt(i,o)),lt(function(o,a,s,l){var u,c,p,f=[],d=[],h=a.length,g=o||Nt(t||"*",s.nodeType?[s]:s,[]),m=!e||!o&&t?g:xt(g,f,e,s,l),y=n?i||(o?e:h||r)?[]:a:m;if(n&&n(m,y,s,l),r){u=xt(y,d),r(u,[],s,l),c=u.length;while(c--)(p=u[c])&&(y[d[c]]=!(m[d[c]]=p))}if(o){if(i||e){if(i){u=[],c=y.length;while(c--)(p=y[c])&&u.push(m[c]=p);i(null,y=[],u,l)}c=y.length;while(c--)(p=y[c])&&(u=i?F.call(o,p):f[c])>-1&&(o[u]=!(a[u]=p))}}else y=xt(y===a?y.splice(h,y.length):y),i?i(null,a,y,l):M.apply(a,y)})}function Tt(e){var t,n,r,i=e.length,a=o.relative[e[0].type],s=a||o.relative[" "],l=a?1:0,c=vt(function(e){return e===t},s,!0),p=vt(function(e){return F.call(t,e)>-1},s,!0),f=[function(e,n,r){return!a&&(r||n!==u)||((t=n).nodeType?c(e,n,r):p(e,n,r))}];for(;i>l;l++)if(n=o.relative[e[l].type])f=[vt(bt(f),n)];else{if(n=o.filter[e[l].type].apply(null,e[l].matches),n[b]){for(r=++l;i>r;r++)if(o.relative[e[r].type])break;return wt(l>1&&bt(f),l>1&&yt(e.slice(0,l-1).concat({value:" "===e[l-2].type?"*":""})).replace(z,"$1"),n,r>l&&Tt(e.slice(l,r)),i>r&&Tt(e=e.slice(r)),i>r&&yt(e))}f.push(n)}return bt(f)}function Ct(e,t){var n=0,r=t.length>0,a=e.length>0,s=function(s,l,c,p,d){var h,g,m,y=[],v=0,b="0",x=s&&[],w=null!=d,C=u,N=s||a&&o.find.TAG("*",d&&l.parentNode||l),k=T+=null==C?1:Math.random()||.1;for(w&&(u=l!==f&&l,i=n);null!=(h=N[b]);b++){if(a&&h){g=0;while(m=e[g++])if(m(h,l,c)){p.push(h);break}w&&(T=k,i=++n)}r&&((h=!m&&h)&&v--,s&&x.push(h))}if(v+=b,r&&b!==v){g=0;while(m=t[g++])m(x,y,l,c);if(s){if(v>0)while(b--)x[b]||y[b]||(y[b]=q.call(p));y=xt(y)}M.apply(p,y),w&&!s&&y.length>0&&v+t.length>1&&at.uniqueSort(p)}return w&&(T=k,u=C),x};return r?lt(s):s}l=at.compile=function(e,t){var n,r=[],i=[],o=E[e+" "];if(!o){t||(t=mt(e)),n=t.length;while(n--)o=Tt(t[n]),o[b]?r.push(o):i.push(o);o=E(e,Ct(i,r))}return o};function Nt(e,t,n){var r=0,i=t.length;for(;i>r;r++)at(e,t[r],n);return n}function kt(e,t,n,i){var a,s,u,c,p,f=mt(e);if(!i&&1===f.length){if(s=f[0]=f[0].slice(0),s.length>2&&"ID"===(u=s[0]).type&&r.getById&&9===t.nodeType&&h&&o.relative[s[1].type]){if(t=(o.find.ID(u.matches[0].replace(rt,it),t)||[])[0],!t)return n;e=e.slice(s.shift().value.length)}a=Q.needsContext.test(e)?0:s.length;while(a--){if(u=s[a],o.relative[c=u.type])break;if((p=o.find[c])&&(i=p(u.matches[0].replace(rt,it),V.test(s[0].type)&&t.parentNode||t))){if(s.splice(a,1),e=i.length&&yt(s),!e)return M.apply(n,i),n;break}}}return l(e,f)(i,t,!h,n,V.test(e)),n}r.sortStable=b.split("").sort(A).join("")===b,r.detectDuplicates=S,p(),r.sortDetached=ut(function(e){return 1&e.compareDocumentPosition(f.createElement("div"))}),ut(function(e){return e.innerHTML="<a href='#'></a>","#"===e.firstChild.getAttribute("href")})||ct("type|href|height|width",function(e,n,r){return r?t:e.getAttribute(n,"type"===n.toLowerCase()?1:2)}),r.attributes&&ut(function(e){return e.innerHTML="<input/>",e.firstChild.setAttribute("value",""),""===e.firstChild.getAttribute("value")})||ct("value",function(e,n,r){return r||"input"!==e.nodeName.toLowerCase()?t:e.defaultValue}),ut(function(e){return null==e.getAttribute("disabled")})||ct(B,function(e,n,r){var i;return r?t:(i=e.getAttributeNode(n))&&i.specified?i.value:e[n]===!0?n.toLowerCase():null}),x.find=at,x.expr=at.selectors,x.expr[":"]=x.expr.pseudos,x.unique=at.uniqueSort,x.text=at.getText,x.isXMLDoc=at.isXML,x.contains=at.contains}(e);var O={};function F(e){var t=O[e]={};return x.each(e.match(T)||[],function(e,n){t[n]=!0}),t}x.Callbacks=function(e){e="string"==typeof e?O[e]||F(e):x.extend({},e);var n,r,i,o,a,s,l=[],u=!e.once&&[],c=function(t){for(r=e.memory&&t,i=!0,a=s||0,s=0,o=l.length,n=!0;l&&o>a;a++)if(l[a].apply(t[0],t[1])===!1&&e.stopOnFalse){r=!1;break}n=!1,l&&(u?u.length&&c(u.shift()):r?l=[]:p.disable())},p={add:function(){if(l){var t=l.length;(function i(t){x.each(t,function(t,n){var r=x.type(n);"function"===r?e.unique&&p.has(n)||l.push(n):n&&n.length&&"string"!==r&&i(n)})})(arguments),n?o=l.length:r&&(s=t,c(r))}return this},remove:function(){return l&&x.each(arguments,function(e,t){var r;while((r=x.inArray(t,l,r))>-1)l.splice(r,1),n&&(o>=r&&o--,a>=r&&a--)}),this},has:function(e){return e?x.inArray(e,l)>-1:!(!l||!l.length)},empty:function(){return l=[],o=0,this},disable:function(){return l=u=r=t,this},disabled:function(){return!l},lock:function(){return u=t,r||p.disable(),this},locked:function(){return!u},fireWith:function(e,t){return!l||i&&!u||(t=t||[],t=[e,t.slice?t.slice():t],n?u.push(t):c(t)),this},fire:function(){return p.fireWith(this,arguments),this},fired:function(){return!!i}};return p},x.extend({Deferred:function(e){var t=[["resolve","done",x.Callbacks("once memory"),"resolved"],["reject","fail",x.Callbacks("once memory"),"rejected"],["notify","progress",x.Callbacks("memory")]],n="pending",r={state:function(){return n},always:function(){return i.done(arguments).fail(arguments),this},then:function(){var e=arguments;return x.Deferred(function(n){x.each(t,function(t,o){var a=o[0],s=x.isFunction(e[t])&&e[t];i[o[1]](function(){var e=s&&s.apply(this,arguments);e&&x.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[a+"With"](this===r?n.promise():this,s?[e]:arguments)})}),e=null}).promise()},promise:function(e){return null!=e?x.extend(e,r):r}},i={};return r.pipe=r.then,x.each(t,function(e,o){var a=o[2],s=o[3];r[o[1]]=a.add,s&&a.add(function(){n=s},t[1^e][2].disable,t[2][2].lock),i[o[0]]=function(){return i[o[0]+"With"](this===i?r:this,arguments),this},i[o[0]+"With"]=a.fireWith}),r.promise(i),e&&e.call(i,i),i},when:function(e){var t=0,n=g.call(arguments),r=n.length,i=1!==r||e&&x.isFunction(e.promise)?r:0,o=1===i?e:x.Deferred(),a=function(e,t,n){return function(r){t[e]=this,n[e]=arguments.length>1?g.call(arguments):r,n===s?o.notifyWith(t,n):--i||o.resolveWith(t,n)}},s,l,u;if(r>1)for(s=Array(r),l=Array(r),u=Array(r);r>t;t++)n[t]&&x.isFunction(n[t].promise)?n[t].promise().done(a(t,u,n)).fail(o.reject).progress(a(t,l,s)):--i;return i||o.resolveWith(u,n),o.promise()}}),x.support=function(t){var n,r,o,s,l,u,c,p,f,d=a.createElement("div");if(d.setAttribute("className","t"),d.innerHTML=" <link/><table></table><a href='/a'>a</a><input type='checkbox'/>",n=d.getElementsByTagName("*")||[],r=d.getElementsByTagName("a")[0],!r||!r.style||!n.length)return t;s=a.createElement("select"),u=s.appendChild(a.createElement("option")),o=d.getElementsByTagName("input")[0],r.style.cssText="top:1px;float:left;opacity:.5",t.getSetAttribute="t"!==d.className,t.leadingWhitespace=3===d.firstChild.nodeType,t.tbody=!d.getElementsByTagName("tbody").length,t.htmlSerialize=!!d.getElementsByTagName("link").length,t.style=/top/.test(r.getAttribute("style")),t.hrefNormalized="/a"===r.getAttribute("href"),t.opacity=/^0.5/.test(r.style.opacity),t.cssFloat=!!r.style.cssFloat,t.checkOn=!!o.value,t.optSelected=u.selected,t.enctype=!!a.createElement("form").enctype,t.html5Clone="<:nav></:nav>"!==a.createElement("nav").cloneNode(!0).outerHTML,t.inlineBlockNeedsLayout=!1,t.shrinkWrapBlocks=!1,t.pixelPosition=!1,t.deleteExpando=!0,t.noCloneEvent=!0,t.reliableMarginRight=!0,t.boxSizingReliable=!0,o.checked=!0,t.noCloneChecked=o.cloneNode(!0).checked,s.disabled=!0,t.optDisabled=!u.disabled;try{delete d.test}catch(h){t.deleteExpando=!1}o=a.createElement("input"),o.setAttribute("value",""),t.input=""===o.getAttribute("value"),o.value="t",o.setAttribute("type","radio"),t.radioValue="t"===o.value,o.setAttribute("checked","t"),o.setAttribute("name","t"),l=a.createDocumentFragment(),l.appendChild(o),t.appendChecked=o.checked,t.checkClone=l.cloneNode(!0).cloneNode(!0).lastChild.checked,d.attachEvent&&(d.attachEvent("onclick",function(){t.noCloneEvent=!1}),d.cloneNode(!0).click());for(f in{submit:!0,change:!0,focusin:!0})d.setAttribute(c="on"+f,"t"),t[f+"Bubbles"]=c in e||d.attributes[c].expando===!1;d.style.backgroundClip="content-box",d.cloneNode(!0).style.backgroundClip="",t.clearCloneStyle="content-box"===d.style.backgroundClip;for(f in x(t))break;return t.ownLast="0"!==f,x(function(){var n,r,o,s="padding:0;margin:0;border:0;display:block;box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;",l=a.getElementsByTagName("body")[0];l&&(n=a.createElement("div"),n.style.cssText="border:0;width:0;height:0;position:absolute;top:0;left:-9999px;margin-top:1px",l.appendChild(n).appendChild(d),d.innerHTML="<table><tr><td></td><td>t</td></tr></table>",o=d.getElementsByTagName("td"),o[0].style.cssText="padding:0;margin:0;border:0;display:none",p=0===o[0].offsetHeight,o[0].style.display="",o[1].style.display="none",t.reliableHiddenOffsets=p&&0===o[0].offsetHeight,d.innerHTML="",d.style.cssText="box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;padding:1px;border:1px;display:block;width:4px;margin-top:1%;position:absolute;top:1%;",x.swap(l,null!=l.style.zoom?{zoom:1}:{},function(){t.boxSizing=4===d.offsetWidth}),e.getComputedStyle&&(t.pixelPosition="1%"!==(e.getComputedStyle(d,null)||{}).top,t.boxSizingReliable="4px"===(e.getComputedStyle(d,null)||{width:"4px"}).width,r=d.appendChild(a.createElement("div")),r.style.cssText=d.style.cssText=s,r.style.marginRight=r.style.width="0",d.style.width="1px",t.reliableMarginRight=!parseFloat((e.getComputedStyle(r,null)||{}).marginRight)),typeof d.style.zoom!==i&&(d.innerHTML="",d.style.cssText=s+"width:1px;padding:1px;display:inline;zoom:1",t.inlineBlockNeedsLayout=3===d.offsetWidth,d.style.display="block",d.innerHTML="<div></div>",d.firstChild.style.width="5px",t.shrinkWrapBlocks=3!==d.offsetWidth,t.inlineBlockNeedsLayout&&(l.style.zoom=1)),l.removeChild(n),n=d=o=r=null)}),n=s=l=u=r=o=null,t
+}({});var B=/(?:\{[\s\S]*\}|\[[\s\S]*\])$/,P=/([A-Z])/g;function R(e,n,r,i){if(x.acceptData(e)){var o,a,s=x.expando,l=e.nodeType,u=l?x.cache:e,c=l?e[s]:e[s]&&s;if(c&&u[c]&&(i||u[c].data)||r!==t||"string"!=typeof n)return c||(c=l?e[s]=p.pop()||x.guid++:s),u[c]||(u[c]=l?{}:{toJSON:x.noop}),("object"==typeof n||"function"==typeof n)&&(i?u[c]=x.extend(u[c],n):u[c].data=x.extend(u[c].data,n)),a=u[c],i||(a.data||(a.data={}),a=a.data),r!==t&&(a[x.camelCase(n)]=r),"string"==typeof n?(o=a[n],null==o&&(o=a[x.camelCase(n)])):o=a,o}}function W(e,t,n){if(x.acceptData(e)){var r,i,o=e.nodeType,a=o?x.cache:e,s=o?e[x.expando]:x.expando;if(a[s]){if(t&&(r=n?a[s]:a[s].data)){x.isArray(t)?t=t.concat(x.map(t,x.camelCase)):t in r?t=[t]:(t=x.camelCase(t),t=t in r?[t]:t.split(" ")),i=t.length;while(i--)delete r[t[i]];if(n?!I(r):!x.isEmptyObject(r))return}(n||(delete a[s].data,I(a[s])))&&(o?x.cleanData([e],!0):x.support.deleteExpando||a!=a.window?delete a[s]:a[s]=null)}}}x.extend({cache:{},noData:{applet:!0,embed:!0,object:"clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"},hasData:function(e){return e=e.nodeType?x.cache[e[x.expando]]:e[x.expando],!!e&&!I(e)},data:function(e,t,n){return R(e,t,n)},removeData:function(e,t){return W(e,t)},_data:function(e,t,n){return R(e,t,n,!0)},_removeData:function(e,t){return W(e,t,!0)},acceptData:function(e){if(e.nodeType&&1!==e.nodeType&&9!==e.nodeType)return!1;var t=e.nodeName&&x.noData[e.nodeName.toLowerCase()];return!t||t!==!0&&e.getAttribute("classid")===t}}),x.fn.extend({data:function(e,n){var r,i,o=null,a=0,s=this[0];if(e===t){if(this.length&&(o=x.data(s),1===s.nodeType&&!x._data(s,"parsedAttrs"))){for(r=s.attributes;r.length>a;a++)i=r[a].name,0===i.indexOf("data-")&&(i=x.camelCase(i.slice(5)),$(s,i,o[i]));x._data(s,"parsedAttrs",!0)}return o}return"object"==typeof e?this.each(function(){x.data(this,e)}):arguments.length>1?this.each(function(){x.data(this,e,n)}):s?$(s,e,x.data(s,e)):null},removeData:function(e){return this.each(function(){x.removeData(this,e)})}});function $(e,n,r){if(r===t&&1===e.nodeType){var i="data-"+n.replace(P,"-$1").toLowerCase();if(r=e.getAttribute(i),"string"==typeof r){try{r="true"===r?!0:"false"===r?!1:"null"===r?null:+r+""===r?+r:B.test(r)?x.parseJSON(r):r}catch(o){}x.data(e,n,r)}else r=t}return r}function I(e){var t;for(t in e)if(("data"!==t||!x.isEmptyObject(e[t]))&&"toJSON"!==t)return!1;return!0}x.extend({queue:function(e,n,r){var i;return e?(n=(n||"fx")+"queue",i=x._data(e,n),r&&(!i||x.isArray(r)?i=x._data(e,n,x.makeArray(r)):i.push(r)),i||[]):t},dequeue:function(e,t){t=t||"fx";var n=x.queue(e,t),r=n.length,i=n.shift(),o=x._queueHooks(e,t),a=function(){x.dequeue(e,t)};"inprogress"===i&&(i=n.shift(),r--),i&&("fx"===t&&n.unshift("inprogress"),delete o.stop,i.call(e,a,o)),!r&&o&&o.empty.fire()},_queueHooks:function(e,t){var n=t+"queueHooks";return x._data(e,n)||x._data(e,n,{empty:x.Callbacks("once memory").add(function(){x._removeData(e,t+"queue"),x._removeData(e,n)})})}}),x.fn.extend({queue:function(e,n){var r=2;return"string"!=typeof e&&(n=e,e="fx",r--),r>arguments.length?x.queue(this[0],e):n===t?this:this.each(function(){var t=x.queue(this,e,n);x._queueHooks(this,e),"fx"===e&&"inprogress"!==t[0]&&x.dequeue(this,e)})},dequeue:function(e){return this.each(function(){x.dequeue(this,e)})},delay:function(e,t){return e=x.fx?x.fx.speeds[e]||e:e,t=t||"fx",this.queue(t,function(t,n){var r=setTimeout(t,e);n.stop=function(){clearTimeout(r)}})},clearQueue:function(e){return this.queue(e||"fx",[])},promise:function(e,n){var r,i=1,o=x.Deferred(),a=this,s=this.length,l=function(){--i||o.resolveWith(a,[a])};"string"!=typeof e&&(n=e,e=t),e=e||"fx";while(s--)r=x._data(a[s],e+"queueHooks"),r&&r.empty&&(i++,r.empty.add(l));return l(),o.promise(n)}});var z,X,U=/[\t\r\n\f]/g,V=/\r/g,Y=/^(?:input|select|textarea|button|object)$/i,J=/^(?:a|area)$/i,G=/^(?:checked|selected)$/i,Q=x.support.getSetAttribute,K=x.support.input;x.fn.extend({attr:function(e,t){return x.access(this,x.attr,e,t,arguments.length>1)},removeAttr:function(e){return this.each(function(){x.removeAttr(this,e)})},prop:function(e,t){return x.access(this,x.prop,e,t,arguments.length>1)},removeProp:function(e){return e=x.propFix[e]||e,this.each(function(){try{this[e]=t,delete this[e]}catch(n){}})},addClass:function(e){var t,n,r,i,o,a=0,s=this.length,l="string"==typeof e&&e;if(x.isFunction(e))return this.each(function(t){x(this).addClass(e.call(this,t,this.className))});if(l)for(t=(e||"").match(T)||[];s>a;a++)if(n=this[a],r=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(U," "):" ")){o=0;while(i=t[o++])0>r.indexOf(" "+i+" ")&&(r+=i+" ");n.className=x.trim(r)}return this},removeClass:function(e){var t,n,r,i,o,a=0,s=this.length,l=0===arguments.length||"string"==typeof e&&e;if(x.isFunction(e))return this.each(function(t){x(this).removeClass(e.call(this,t,this.className))});if(l)for(t=(e||"").match(T)||[];s>a;a++)if(n=this[a],r=1===n.nodeType&&(n.className?(" "+n.className+" ").replace(U," "):"")){o=0;while(i=t[o++])while(r.indexOf(" "+i+" ")>=0)r=r.replace(" "+i+" "," ");n.className=e?x.trim(r):""}return this},toggleClass:function(e,t){var n=typeof e;return"boolean"==typeof t&&"string"===n?t?this.addClass(e):this.removeClass(e):x.isFunction(e)?this.each(function(n){x(this).toggleClass(e.call(this,n,this.className,t),t)}):this.each(function(){if("string"===n){var t,r=0,o=x(this),a=e.match(T)||[];while(t=a[r++])o.hasClass(t)?o.removeClass(t):o.addClass(t)}else(n===i||"boolean"===n)&&(this.className&&x._data(this,"__className__",this.className),this.className=this.className||e===!1?"":x._data(this,"__className__")||"")})},hasClass:function(e){var t=" "+e+" ",n=0,r=this.length;for(;r>n;n++)if(1===this[n].nodeType&&(" "+this[n].className+" ").replace(U," ").indexOf(t)>=0)return!0;return!1},val:function(e){var n,r,i,o=this[0];{if(arguments.length)return i=x.isFunction(e),this.each(function(n){var o;1===this.nodeType&&(o=i?e.call(this,n,x(this).val()):e,null==o?o="":"number"==typeof o?o+="":x.isArray(o)&&(o=x.map(o,function(e){return null==e?"":e+""})),r=x.valHooks[this.type]||x.valHooks[this.nodeName.toLowerCase()],r&&"set"in r&&r.set(this,o,"value")!==t||(this.value=o))});if(o)return r=x.valHooks[o.type]||x.valHooks[o.nodeName.toLowerCase()],r&&"get"in r&&(n=r.get(o,"value"))!==t?n:(n=o.value,"string"==typeof n?n.replace(V,""):null==n?"":n)}}}),x.extend({valHooks:{option:{get:function(e){var t=x.find.attr(e,"value");return null!=t?t:e.text}},select:{get:function(e){var t,n,r=e.options,i=e.selectedIndex,o="select-one"===e.type||0>i,a=o?null:[],s=o?i+1:r.length,l=0>i?s:o?i:0;for(;s>l;l++)if(n=r[l],!(!n.selected&&l!==i||(x.support.optDisabled?n.disabled:null!==n.getAttribute("disabled"))||n.parentNode.disabled&&x.nodeName(n.parentNode,"optgroup"))){if(t=x(n).val(),o)return t;a.push(t)}return a},set:function(e,t){var n,r,i=e.options,o=x.makeArray(t),a=i.length;while(a--)r=i[a],(r.selected=x.inArray(x(r).val(),o)>=0)&&(n=!0);return n||(e.selectedIndex=-1),o}}},attr:function(e,n,r){var o,a,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return typeof e.getAttribute===i?x.prop(e,n,r):(1===s&&x.isXMLDoc(e)||(n=n.toLowerCase(),o=x.attrHooks[n]||(x.expr.match.bool.test(n)?X:z)),r===t?o&&"get"in o&&null!==(a=o.get(e,n))?a:(a=x.find.attr(e,n),null==a?t:a):null!==r?o&&"set"in o&&(a=o.set(e,r,n))!==t?a:(e.setAttribute(n,r+""),r):(x.removeAttr(e,n),t))},removeAttr:function(e,t){var n,r,i=0,o=t&&t.match(T);if(o&&1===e.nodeType)while(n=o[i++])r=x.propFix[n]||n,x.expr.match.bool.test(n)?K&&Q||!G.test(n)?e[r]=!1:e[x.camelCase("default-"+n)]=e[r]=!1:x.attr(e,n,""),e.removeAttribute(Q?n:r)},attrHooks:{type:{set:function(e,t){if(!x.support.radioValue&&"radio"===t&&x.nodeName(e,"input")){var n=e.value;return e.setAttribute("type",t),n&&(e.value=n),t}}}},propFix:{"for":"htmlFor","class":"className"},prop:function(e,n,r){var i,o,a,s=e.nodeType;if(e&&3!==s&&8!==s&&2!==s)return a=1!==s||!x.isXMLDoc(e),a&&(n=x.propFix[n]||n,o=x.propHooks[n]),r!==t?o&&"set"in o&&(i=o.set(e,r,n))!==t?i:e[n]=r:o&&"get"in o&&null!==(i=o.get(e,n))?i:e[n]},propHooks:{tabIndex:{get:function(e){var t=x.find.attr(e,"tabindex");return t?parseInt(t,10):Y.test(e.nodeName)||J.test(e.nodeName)&&e.href?0:-1}}}}),X={set:function(e,t,n){return t===!1?x.removeAttr(e,n):K&&Q||!G.test(n)?e.setAttribute(!Q&&x.propFix[n]||n,n):e[x.camelCase("default-"+n)]=e[n]=!0,n}},x.each(x.expr.match.bool.source.match(/\w+/g),function(e,n){var r=x.expr.attrHandle[n]||x.find.attr;x.expr.attrHandle[n]=K&&Q||!G.test(n)?function(e,n,i){var o=x.expr.attrHandle[n],a=i?t:(x.expr.attrHandle[n]=t)!=r(e,n,i)?n.toLowerCase():null;return x.expr.attrHandle[n]=o,a}:function(e,n,r){return r?t:e[x.camelCase("default-"+n)]?n.toLowerCase():null}}),K&&Q||(x.attrHooks.value={set:function(e,n,r){return x.nodeName(e,"input")?(e.defaultValue=n,t):z&&z.set(e,n,r)}}),Q||(z={set:function(e,n,r){var i=e.getAttributeNode(r);return i||e.setAttributeNode(i=e.ownerDocument.createAttribute(r)),i.value=n+="","value"===r||n===e.getAttribute(r)?n:t}},x.expr.attrHandle.id=x.expr.attrHandle.name=x.expr.attrHandle.coords=function(e,n,r){var i;return r?t:(i=e.getAttributeNode(n))&&""!==i.value?i.value:null},x.valHooks.button={get:function(e,n){var r=e.getAttributeNode(n);return r&&r.specified?r.value:t},set:z.set},x.attrHooks.contenteditable={set:function(e,t,n){z.set(e,""===t?!1:t,n)}},x.each(["width","height"],function(e,n){x.attrHooks[n]={set:function(e,r){return""===r?(e.setAttribute(n,"auto"),r):t}}})),x.support.hrefNormalized||x.each(["href","src"],function(e,t){x.propHooks[t]={get:function(e){return e.getAttribute(t,4)}}}),x.support.style||(x.attrHooks.style={get:function(e){return e.style.cssText||t},set:function(e,t){return e.style.cssText=t+""}}),x.support.optSelected||(x.propHooks.selected={get:function(e){var t=e.parentNode;return t&&(t.selectedIndex,t.parentNode&&t.parentNode.selectedIndex),null}}),x.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){x.propFix[this.toLowerCase()]=this}),x.support.enctype||(x.propFix.enctype="encoding"),x.each(["radio","checkbox"],function(){x.valHooks[this]={set:function(e,n){return x.isArray(n)?e.checked=x.inArray(x(e).val(),n)>=0:t}},x.support.checkOn||(x.valHooks[this].get=function(e){return null===e.getAttribute("value")?"on":e.value})});var Z=/^(?:input|select|textarea)$/i,et=/^key/,tt=/^(?:mouse|contextmenu)|click/,nt=/^(?:focusinfocus|focusoutblur)$/,rt=/^([^.]*)(?:\.(.+)|)$/;function it(){return!0}function ot(){return!1}function at(){try{return a.activeElement}catch(e){}}x.event={global:{},add:function(e,n,r,o,a){var s,l,u,c,p,f,d,h,g,m,y,v=x._data(e);if(v){r.handler&&(c=r,r=c.handler,a=c.selector),r.guid||(r.guid=x.guid++),(l=v.events)||(l=v.events={}),(f=v.handle)||(f=v.handle=function(e){return typeof x===i||e&&x.event.triggered===e.type?t:x.event.dispatch.apply(f.elem,arguments)},f.elem=e),n=(n||"").match(T)||[""],u=n.length;while(u--)s=rt.exec(n[u])||[],g=y=s[1],m=(s[2]||"").split(".").sort(),g&&(p=x.event.special[g]||{},g=(a?p.delegateType:p.bindType)||g,p=x.event.special[g]||{},d=x.extend({type:g,origType:y,data:o,handler:r,guid:r.guid,selector:a,needsContext:a&&x.expr.match.needsContext.test(a),namespace:m.join(".")},c),(h=l[g])||(h=l[g]=[],h.delegateCount=0,p.setup&&p.setup.call(e,o,m,f)!==!1||(e.addEventListener?e.addEventListener(g,f,!1):e.attachEvent&&e.attachEvent("on"+g,f))),p.add&&(p.add.call(e,d),d.handler.guid||(d.handler.guid=r.guid)),a?h.splice(h.delegateCount++,0,d):h.push(d),x.event.global[g]=!0);e=null}},remove:function(e,t,n,r,i){var o,a,s,l,u,c,p,f,d,h,g,m=x.hasData(e)&&x._data(e);if(m&&(c=m.events)){t=(t||"").match(T)||[""],u=t.length;while(u--)if(s=rt.exec(t[u])||[],d=g=s[1],h=(s[2]||"").split(".").sort(),d){p=x.event.special[d]||{},d=(r?p.delegateType:p.bindType)||d,f=c[d]||[],s=s[2]&&RegExp("(^|\\.)"+h.join("\\.(?:.*\\.|)")+"(\\.|$)"),l=o=f.length;while(o--)a=f[o],!i&&g!==a.origType||n&&n.guid!==a.guid||s&&!s.test(a.namespace)||r&&r!==a.selector&&("**"!==r||!a.selector)||(f.splice(o,1),a.selector&&f.delegateCount--,p.remove&&p.remove.call(e,a));l&&!f.length&&(p.teardown&&p.teardown.call(e,h,m.handle)!==!1||x.removeEvent(e,d,m.handle),delete c[d])}else for(d in c)x.event.remove(e,d+t[u],n,r,!0);x.isEmptyObject(c)&&(delete m.handle,x._removeData(e,"events"))}},trigger:function(n,r,i,o){var s,l,u,c,p,f,d,h=[i||a],g=v.call(n,"type")?n.type:n,m=v.call(n,"namespace")?n.namespace.split("."):[];if(u=f=i=i||a,3!==i.nodeType&&8!==i.nodeType&&!nt.test(g+x.event.triggered)&&(g.indexOf(".")>=0&&(m=g.split("."),g=m.shift(),m.sort()),l=0>g.indexOf(":")&&"on"+g,n=n[x.expando]?n:new x.Event(g,"object"==typeof n&&n),n.isTrigger=o?2:3,n.namespace=m.join("."),n.namespace_re=n.namespace?RegExp("(^|\\.)"+m.join("\\.(?:.*\\.|)")+"(\\.|$)"):null,n.result=t,n.target||(n.target=i),r=null==r?[n]:x.makeArray(r,[n]),p=x.event.special[g]||{},o||!p.trigger||p.trigger.apply(i,r)!==!1)){if(!o&&!p.noBubble&&!x.isWindow(i)){for(c=p.delegateType||g,nt.test(c+g)||(u=u.parentNode);u;u=u.parentNode)h.push(u),f=u;f===(i.ownerDocument||a)&&h.push(f.defaultView||f.parentWindow||e)}d=0;while((u=h[d++])&&!n.isPropagationStopped())n.type=d>1?c:p.bindType||g,s=(x._data(u,"events")||{})[n.type]&&x._data(u,"handle"),s&&s.apply(u,r),s=l&&u[l],s&&x.acceptData(u)&&s.apply&&s.apply(u,r)===!1&&n.preventDefault();if(n.type=g,!o&&!n.isDefaultPrevented()&&(!p._default||p._default.apply(h.pop(),r)===!1)&&x.acceptData(i)&&l&&i[g]&&!x.isWindow(i)){f=i[l],f&&(i[l]=null),x.event.triggered=g;try{i[g]()}catch(y){}x.event.triggered=t,f&&(i[l]=f)}return n.result}},dispatch:function(e){e=x.event.fix(e);var n,r,i,o,a,s=[],l=g.call(arguments),u=(x._data(this,"events")||{})[e.type]||[],c=x.event.special[e.type]||{};if(l[0]=e,e.delegateTarget=this,!c.preDispatch||c.preDispatch.call(this,e)!==!1){s=x.event.handlers.call(this,e,u),n=0;while((o=s[n++])&&!e.isPropagationStopped()){e.currentTarget=o.elem,a=0;while((i=o.handlers[a++])&&!e.isImmediatePropagationStopped())(!e.namespace_re||e.namespace_re.test(i.namespace))&&(e.handleObj=i,e.data=i.data,r=((x.event.special[i.origType]||{}).handle||i.handler).apply(o.elem,l),r!==t&&(e.result=r)===!1&&(e.preventDefault(),e.stopPropagation()))}return c.postDispatch&&c.postDispatch.call(this,e),e.result}},handlers:function(e,n){var r,i,o,a,s=[],l=n.delegateCount,u=e.target;if(l&&u.nodeType&&(!e.button||"click"!==e.type))for(;u!=this;u=u.parentNode||this)if(1===u.nodeType&&(u.disabled!==!0||"click"!==e.type)){for(o=[],a=0;l>a;a++)i=n[a],r=i.selector+" ",o[r]===t&&(o[r]=i.needsContext?x(r,this).index(u)>=0:x.find(r,this,null,[u]).length),o[r]&&o.push(i);o.length&&s.push({elem:u,handlers:o})}return n.length>l&&s.push({elem:this,handlers:n.slice(l)}),s},fix:function(e){if(e[x.expando])return e;var t,n,r,i=e.type,o=e,s=this.fixHooks[i];s||(this.fixHooks[i]=s=tt.test(i)?this.mouseHooks:et.test(i)?this.keyHooks:{}),r=s.props?this.props.concat(s.props):this.props,e=new x.Event(o),t=r.length;while(t--)n=r[t],e[n]=o[n];return e.target||(e.target=o.srcElement||a),3===e.target.nodeType&&(e.target=e.target.parentNode),e.metaKey=!!e.metaKey,s.filter?s.filter(e,o):e},props:"altKey bubbles cancelable ctrlKey currentTarget eventPhase metaKey relatedTarget shiftKey target timeStamp view which".split(" "),fixHooks:{},keyHooks:{props:"char charCode key keyCode".split(" "),filter:function(e,t){return null==e.which&&(e.which=null!=t.charCode?t.charCode:t.keyCode),e}},mouseHooks:{props:"button buttons clientX clientY fromElement offsetX offsetY pageX pageY screenX screenY toElement".split(" "),filter:function(e,n){var r,i,o,s=n.button,l=n.fromElement;return null==e.pageX&&null!=n.clientX&&(i=e.target.ownerDocument||a,o=i.documentElement,r=i.body,e.pageX=n.clientX+(o&&o.scrollLeft||r&&r.scrollLeft||0)-(o&&o.clientLeft||r&&r.clientLeft||0),e.pageY=n.clientY+(o&&o.scrollTop||r&&r.scrollTop||0)-(o&&o.clientTop||r&&r.clientTop||0)),!e.relatedTarget&&l&&(e.relatedTarget=l===e.target?n.toElement:l),e.which||s===t||(e.which=1&s?1:2&s?3:4&s?2:0),e}},special:{load:{noBubble:!0},focus:{trigger:function(){if(this!==at()&&this.focus)try{return this.focus(),!1}catch(e){}},delegateType:"focusin"},blur:{trigger:function(){return this===at()&&this.blur?(this.blur(),!1):t},delegateType:"focusout"},click:{trigger:function(){return x.nodeName(this,"input")&&"checkbox"===this.type&&this.click?(this.click(),!1):t},_default:function(e){return x.nodeName(e.target,"a")}},beforeunload:{postDispatch:function(e){e.result!==t&&(e.originalEvent.returnValue=e.result)}}},simulate:function(e,t,n,r){var i=x.extend(new x.Event,n,{type:e,isSimulated:!0,originalEvent:{}});r?x.event.trigger(i,null,t):x.event.dispatch.call(t,i),i.isDefaultPrevented()&&n.preventDefault()}},x.removeEvent=a.removeEventListener?function(e,t,n){e.removeEventListener&&e.removeEventListener(t,n,!1)}:function(e,t,n){var r="on"+t;e.detachEvent&&(typeof e[r]===i&&(e[r]=null),e.detachEvent(r,n))},x.Event=function(e,n){return this instanceof x.Event?(e&&e.type?(this.originalEvent=e,this.type=e.type,this.isDefaultPrevented=e.defaultPrevented||e.returnValue===!1||e.getPreventDefault&&e.getPreventDefault()?it:ot):this.type=e,n&&x.extend(this,n),this.timeStamp=e&&e.timeStamp||x.now(),this[x.expando]=!0,t):new x.Event(e,n)},x.Event.prototype={isDefaultPrevented:ot,isPropagationStopped:ot,isImmediatePropagationStopped:ot,preventDefault:function(){var e=this.originalEvent;this.isDefaultPrevented=it,e&&(e.preventDefault?e.preventDefault():e.returnValue=!1)},stopPropagation:function(){var e=this.originalEvent;this.isPropagationStopped=it,e&&(e.stopPropagation&&e.stopPropagation(),e.cancelBubble=!0)},stopImmediatePropagation:function(){this.isImmediatePropagationStopped=it,this.stopPropagation()}},x.each({mouseenter:"mouseover",mouseleave:"mouseout"},function(e,t){x.event.special[e]={delegateType:t,bindType:t,handle:function(e){var n,r=this,i=e.relatedTarget,o=e.handleObj;return(!i||i!==r&&!x.contains(r,i))&&(e.type=o.origType,n=o.handler.apply(this,arguments),e.type=t),n}}}),x.support.submitBubbles||(x.event.special.submit={setup:function(){return x.nodeName(this,"form")?!1:(x.event.add(this,"click._submit keypress._submit",function(e){var n=e.target,r=x.nodeName(n,"input")||x.nodeName(n,"button")?n.form:t;r&&!x._data(r,"submitBubbles")&&(x.event.add(r,"submit._submit",function(e){e._submit_bubble=!0}),x._data(r,"submitBubbles",!0))}),t)},postDispatch:function(e){e._submit_bubble&&(delete e._submit_bubble,this.parentNode&&!e.isTrigger&&x.event.simulate("submit",this.parentNode,e,!0))},teardown:function(){return x.nodeName(this,"form")?!1:(x.event.remove(this,"._submit"),t)}}),x.support.changeBubbles||(x.event.special.change={setup:function(){return Z.test(this.nodeName)?(("checkbox"===this.type||"radio"===this.type)&&(x.event.add(this,"propertychange._change",function(e){"checked"===e.originalEvent.propertyName&&(this._just_changed=!0)}),x.event.add(this,"click._change",function(e){this._just_changed&&!e.isTrigger&&(this._just_changed=!1),x.event.simulate("change",this,e,!0)})),!1):(x.event.add(this,"beforeactivate._change",function(e){var t=e.target;Z.test(t.nodeName)&&!x._data(t,"changeBubbles")&&(x.event.add(t,"change._change",function(e){!this.parentNode||e.isSimulated||e.isTrigger||x.event.simulate("change",this.parentNode,e,!0)}),x._data(t,"changeBubbles",!0))}),t)},handle:function(e){var n=e.target;return this!==n||e.isSimulated||e.isTrigger||"radio"!==n.type&&"checkbox"!==n.type?e.handleObj.handler.apply(this,arguments):t},teardown:function(){return x.event.remove(this,"._change"),!Z.test(this.nodeName)}}),x.support.focusinBubbles||x.each({focus:"focusin",blur:"focusout"},function(e,t){var n=0,r=function(e){x.event.simulate(t,e.target,x.event.fix(e),!0)};x.event.special[t]={setup:function(){0===n++&&a.addEventListener(e,r,!0)},teardown:function(){0===--n&&a.removeEventListener(e,r,!0)}}}),x.fn.extend({on:function(e,n,r,i,o){var a,s;if("object"==typeof e){"string"!=typeof n&&(r=r||n,n=t);for(a in e)this.on(a,n,r,e[a],o);return this}if(null==r&&null==i?(i=n,r=n=t):null==i&&("string"==typeof n?(i=r,r=t):(i=r,r=n,n=t)),i===!1)i=ot;else if(!i)return this;return 1===o&&(s=i,i=function(e){return x().off(e),s.apply(this,arguments)},i.guid=s.guid||(s.guid=x.guid++)),this.each(function(){x.event.add(this,e,i,r,n)})},one:function(e,t,n,r){return this.on(e,t,n,r,1)},off:function(e,n,r){var i,o;if(e&&e.preventDefault&&e.handleObj)return i=e.handleObj,x(e.delegateTarget).off(i.namespace?i.origType+"."+i.namespace:i.origType,i.selector,i.handler),this;if("object"==typeof e){for(o in e)this.off(o,n,e[o]);return this}return(n===!1||"function"==typeof n)&&(r=n,n=t),r===!1&&(r=ot),this.each(function(){x.event.remove(this,e,r,n)})},trigger:function(e,t){return this.each(function(){x.event.trigger(e,t,this)})},triggerHandler:function(e,n){var r=this[0];return r?x.event.trigger(e,n,r,!0):t}});var st=/^.[^:#\[\.,]*$/,lt=/^(?:parents|prev(?:Until|All))/,ut=x.expr.match.needsContext,ct={children:!0,contents:!0,next:!0,prev:!0};x.fn.extend({find:function(e){var t,n=[],r=this,i=r.length;if("string"!=typeof e)return this.pushStack(x(e).filter(function(){for(t=0;i>t;t++)if(x.contains(r[t],this))return!0}));for(t=0;i>t;t++)x.find(e,r[t],n);return n=this.pushStack(i>1?x.unique(n):n),n.selector=this.selector?this.selector+" "+e:e,n},has:function(e){var t,n=x(e,this),r=n.length;return this.filter(function(){for(t=0;r>t;t++)if(x.contains(this,n[t]))return!0})},not:function(e){return this.pushStack(ft(this,e||[],!0))},filter:function(e){return this.pushStack(ft(this,e||[],!1))},is:function(e){return!!ft(this,"string"==typeof e&&ut.test(e)?x(e):e||[],!1).length},closest:function(e,t){var n,r=0,i=this.length,o=[],a=ut.test(e)||"string"!=typeof e?x(e,t||this.context):0;for(;i>r;r++)for(n=this[r];n&&n!==t;n=n.parentNode)if(11>n.nodeType&&(a?a.index(n)>-1:1===n.nodeType&&x.find.matchesSelector(n,e))){n=o.push(n);break}return this.pushStack(o.length>1?x.unique(o):o)},index:function(e){return e?"string"==typeof e?x.inArray(this[0],x(e)):x.inArray(e.jquery?e[0]:e,this):this[0]&&this[0].parentNode?this.first().prevAll().length:-1},add:function(e,t){var n="string"==typeof e?x(e,t):x.makeArray(e&&e.nodeType?[e]:e),r=x.merge(this.get(),n);return this.pushStack(x.unique(r))},addBack:function(e){return this.add(null==e?this.prevObject:this.prevObject.filter(e))}});function pt(e,t){do e=e[t];while(e&&1!==e.nodeType);return e}x.each({parent:function(e){var t=e.parentNode;return t&&11!==t.nodeType?t:null},parents:function(e){return x.dir(e,"parentNode")},parentsUntil:function(e,t,n){return x.dir(e,"parentNode",n)},next:function(e){return pt(e,"nextSibling")},prev:function(e){return pt(e,"previousSibling")},nextAll:function(e){return x.dir(e,"nextSibling")},prevAll:function(e){return x.dir(e,"previousSibling")},nextUntil:function(e,t,n){return x.dir(e,"nextSibling",n)},prevUntil:function(e,t,n){return x.dir(e,"previousSibling",n)},siblings:function(e){return x.sibling((e.parentNode||{}).firstChild,e)},children:function(e){return x.sibling(e.firstChild)},contents:function(e){return x.nodeName(e,"iframe")?e.contentDocument||e.contentWindow.document:x.merge([],e.childNodes)}},function(e,t){x.fn[e]=function(n,r){var i=x.map(this,t,n);return"Until"!==e.slice(-5)&&(r=n),r&&"string"==typeof r&&(i=x.filter(r,i)),this.length>1&&(ct[e]||(i=x.unique(i)),lt.test(e)&&(i=i.reverse())),this.pushStack(i)}}),x.extend({filter:function(e,t,n){var r=t[0];return n&&(e=":not("+e+")"),1===t.length&&1===r.nodeType?x.find.matchesSelector(r,e)?[r]:[]:x.find.matches(e,x.grep(t,function(e){return 1===e.nodeType}))},dir:function(e,n,r){var i=[],o=e[n];while(o&&9!==o.nodeType&&(r===t||1!==o.nodeType||!x(o).is(r)))1===o.nodeType&&i.push(o),o=o[n];return i},sibling:function(e,t){var n=[];for(;e;e=e.nextSibling)1===e.nodeType&&e!==t&&n.push(e);return n}});function ft(e,t,n){if(x.isFunction(t))return x.grep(e,function(e,r){return!!t.call(e,r,e)!==n});if(t.nodeType)return x.grep(e,function(e){return e===t!==n});if("string"==typeof t){if(st.test(t))return x.filter(t,e,n);t=x.filter(t,e)}return x.grep(e,function(e){return x.inArray(e,t)>=0!==n})}function dt(e){var t=ht.split("|"),n=e.createDocumentFragment();if(n.createElement)while(t.length)n.createElement(t.pop());return n}var ht="abbr|article|aside|audio|bdi|canvas|data|datalist|details|figcaption|figure|footer|header|hgroup|mark|meter|nav|output|progress|section|summary|time|video",gt=/ jQuery\d+="(?:null|\d+)"/g,mt=RegExp("<(?:"+ht+")[\\s/>]","i"),yt=/^\s+/,vt=/<(?!area|br|col|embed|hr|img|input|link|meta|param)(([\w:]+)[^>]*)\/>/gi,bt=/<([\w:]+)/,xt=/<tbody/i,wt=/<|&#?\w+;/,Tt=/<(?:script|style|link)/i,Ct=/^(?:checkbox|radio)$/i,Nt=/checked\s*(?:[^=]|=\s*.checked.)/i,kt=/^$|\/(?:java|ecma)script/i,Et=/^true\/(.*)/,St=/^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g,At={option:[1,"<select multiple='multiple'>","</select>"],legend:[1,"<fieldset>","</fieldset>"],area:[1,"<map>","</map>"],param:[1,"<object>","</object>"],thead:[1,"<table>","</table>"],tr:[2,"<table><tbody>","</tbody></table>"],col:[2,"<table><tbody></tbody><colgroup>","</colgroup></table>"],td:[3,"<table><tbody><tr>","</tr></tbody></table>"],_default:x.support.htmlSerialize?[0,"",""]:[1,"X<div>","</div>"]},jt=dt(a),Dt=jt.appendChild(a.createElement("div"));At.optgroup=At.option,At.tbody=At.tfoot=At.colgroup=At.caption=At.thead,At.th=At.td,x.fn.extend({text:function(e){return x.access(this,function(e){return e===t?x.text(this):this.empty().append((this[0]&&this[0].ownerDocument||a).createTextNode(e))},null,e,arguments.length)},append:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=Lt(this,e);t.appendChild(e)}})},prepend:function(){return this.domManip(arguments,function(e){if(1===this.nodeType||11===this.nodeType||9===this.nodeType){var t=Lt(this,e);t.insertBefore(e,t.firstChild)}})},before:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this)})},after:function(){return this.domManip(arguments,function(e){this.parentNode&&this.parentNode.insertBefore(e,this.nextSibling)})},remove:function(e,t){var n,r=e?x.filter(e,this):this,i=0;for(;null!=(n=r[i]);i++)t||1!==n.nodeType||x.cleanData(Ft(n)),n.parentNode&&(t&&x.contains(n.ownerDocument,n)&&_t(Ft(n,"script")),n.parentNode.removeChild(n));return this},empty:function(){var e,t=0;for(;null!=(e=this[t]);t++){1===e.nodeType&&x.cleanData(Ft(e,!1));while(e.firstChild)e.removeChild(e.firstChild);e.options&&x.nodeName(e,"select")&&(e.options.length=0)}return this},clone:function(e,t){return e=null==e?!1:e,t=null==t?e:t,this.map(function(){return x.clone(this,e,t)})},html:function(e){return x.access(this,function(e){var n=this[0]||{},r=0,i=this.length;if(e===t)return 1===n.nodeType?n.innerHTML.replace(gt,""):t;if(!("string"!=typeof e||Tt.test(e)||!x.support.htmlSerialize&&mt.test(e)||!x.support.leadingWhitespace&&yt.test(e)||At[(bt.exec(e)||["",""])[1].toLowerCase()])){e=e.replace(vt,"<$1></$2>");try{for(;i>r;r++)n=this[r]||{},1===n.nodeType&&(x.cleanData(Ft(n,!1)),n.innerHTML=e);n=0}catch(o){}}n&&this.empty().append(e)},null,e,arguments.length)},replaceWith:function(){var e=x.map(this,function(e){return[e.nextSibling,e.parentNode]}),t=0;return this.domManip(arguments,function(n){var r=e[t++],i=e[t++];i&&(r&&r.parentNode!==i&&(r=this.nextSibling),x(this).remove(),i.insertBefore(n,r))},!0),t?this:this.remove()},detach:function(e){return this.remove(e,!0)},domManip:function(e,t,n){e=d.apply([],e);var r,i,o,a,s,l,u=0,c=this.length,p=this,f=c-1,h=e[0],g=x.isFunction(h);if(g||!(1>=c||"string"!=typeof h||x.support.checkClone)&&Nt.test(h))return this.each(function(r){var i=p.eq(r);g&&(e[0]=h.call(this,r,i.html())),i.domManip(e,t,n)});if(c&&(l=x.buildFragment(e,this[0].ownerDocument,!1,!n&&this),r=l.firstChild,1===l.childNodes.length&&(l=r),r)){for(a=x.map(Ft(l,"script"),Ht),o=a.length;c>u;u++)i=l,u!==f&&(i=x.clone(i,!0,!0),o&&x.merge(a,Ft(i,"script"))),t.call(this[u],i,u);if(o)for(s=a[a.length-1].ownerDocument,x.map(a,qt),u=0;o>u;u++)i=a[u],kt.test(i.type||"")&&!x._data(i,"globalEval")&&x.contains(s,i)&&(i.src?x._evalUrl(i.src):x.globalEval((i.text||i.textContent||i.innerHTML||"").replace(St,"")));l=r=null}return this}});function Lt(e,t){return x.nodeName(e,"table")&&x.nodeName(1===t.nodeType?t:t.firstChild,"tr")?e.getElementsByTagName("tbody")[0]||e.appendChild(e.ownerDocument.createElement("tbody")):e}function Ht(e){return e.type=(null!==x.find.attr(e,"type"))+"/"+e.type,e}function qt(e){var t=Et.exec(e.type);return t?e.type=t[1]:e.removeAttribute("type"),e}function _t(e,t){var n,r=0;for(;null!=(n=e[r]);r++)x._data(n,"globalEval",!t||x._data(t[r],"globalEval"))}function Mt(e,t){if(1===t.nodeType&&x.hasData(e)){var n,r,i,o=x._data(e),a=x._data(t,o),s=o.events;if(s){delete a.handle,a.events={};for(n in s)for(r=0,i=s[n].length;i>r;r++)x.event.add(t,n,s[n][r])}a.data&&(a.data=x.extend({},a.data))}}function Ot(e,t){var n,r,i;if(1===t.nodeType){if(n=t.nodeName.toLowerCase(),!x.support.noCloneEvent&&t[x.expando]){i=x._data(t);for(r in i.events)x.removeEvent(t,r,i.handle);t.removeAttribute(x.expando)}"script"===n&&t.text!==e.text?(Ht(t).text=e.text,qt(t)):"object"===n?(t.parentNode&&(t.outerHTML=e.outerHTML),x.support.html5Clone&&e.innerHTML&&!x.trim(t.innerHTML)&&(t.innerHTML=e.innerHTML)):"input"===n&&Ct.test(e.type)?(t.defaultChecked=t.checked=e.checked,t.value!==e.value&&(t.value=e.value)):"option"===n?t.defaultSelected=t.selected=e.defaultSelected:("input"===n||"textarea"===n)&&(t.defaultValue=e.defaultValue)}}x.each({appendTo:"append",prependTo:"prepend",insertBefore:"before",insertAfter:"after",replaceAll:"replaceWith"},function(e,t){x.fn[e]=function(e){var n,r=0,i=[],o=x(e),a=o.length-1;for(;a>=r;r++)n=r===a?this:this.clone(!0),x(o[r])[t](n),h.apply(i,n.get());return this.pushStack(i)}});function Ft(e,n){var r,o,a=0,s=typeof e.getElementsByTagName!==i?e.getElementsByTagName(n||"*"):typeof e.querySelectorAll!==i?e.querySelectorAll(n||"*"):t;if(!s)for(s=[],r=e.childNodes||e;null!=(o=r[a]);a++)!n||x.nodeName(o,n)?s.push(o):x.merge(s,Ft(o,n));return n===t||n&&x.nodeName(e,n)?x.merge([e],s):s}function Bt(e){Ct.test(e.type)&&(e.defaultChecked=e.checked)}x.extend({clone:function(e,t,n){var r,i,o,a,s,l=x.contains(e.ownerDocument,e);if(x.support.html5Clone||x.isXMLDoc(e)||!mt.test("<"+e.nodeName+">")?o=e.cloneNode(!0):(Dt.innerHTML=e.outerHTML,Dt.removeChild(o=Dt.firstChild)),!(x.support.noCloneEvent&&x.support.noCloneChecked||1!==e.nodeType&&11!==e.nodeType||x.isXMLDoc(e)))for(r=Ft(o),s=Ft(e),a=0;null!=(i=s[a]);++a)r[a]&&Ot(i,r[a]);if(t)if(n)for(s=s||Ft(e),r=r||Ft(o),a=0;null!=(i=s[a]);a++)Mt(i,r[a]);else Mt(e,o);return r=Ft(o,"script"),r.length>0&&_t(r,!l&&Ft(e,"script")),r=s=i=null,o},buildFragment:function(e,t,n,r){var i,o,a,s,l,u,c,p=e.length,f=dt(t),d=[],h=0;for(;p>h;h++)if(o=e[h],o||0===o)if("object"===x.type(o))x.merge(d,o.nodeType?[o]:o);else if(wt.test(o)){s=s||f.appendChild(t.createElement("div")),l=(bt.exec(o)||["",""])[1].toLowerCase(),c=At[l]||At._default,s.innerHTML=c[1]+o.replace(vt,"<$1></$2>")+c[2],i=c[0];while(i--)s=s.lastChild;if(!x.support.leadingWhitespace&&yt.test(o)&&d.push(t.createTextNode(yt.exec(o)[0])),!x.support.tbody){o="table"!==l||xt.test(o)?"<table>"!==c[1]||xt.test(o)?0:s:s.firstChild,i=o&&o.childNodes.length;while(i--)x.nodeName(u=o.childNodes[i],"tbody")&&!u.childNodes.length&&o.removeChild(u)}x.merge(d,s.childNodes),s.textContent="";while(s.firstChild)s.removeChild(s.firstChild);s=f.lastChild}else d.push(t.createTextNode(o));s&&f.removeChild(s),x.support.appendChecked||x.grep(Ft(d,"input"),Bt),h=0;while(o=d[h++])if((!r||-1===x.inArray(o,r))&&(a=x.contains(o.ownerDocument,o),s=Ft(f.appendChild(o),"script"),a&&_t(s),n)){i=0;while(o=s[i++])kt.test(o.type||"")&&n.push(o)}return s=null,f},cleanData:function(e,t){var n,r,o,a,s=0,l=x.expando,u=x.cache,c=x.support.deleteExpando,f=x.event.special;for(;null!=(n=e[s]);s++)if((t||x.acceptData(n))&&(o=n[l],a=o&&u[o])){if(a.events)for(r in a.events)f[r]?x.event.remove(n,r):x.removeEvent(n,r,a.handle);
+u[o]&&(delete u[o],c?delete n[l]:typeof n.removeAttribute!==i?n.removeAttribute(l):n[l]=null,p.push(o))}},_evalUrl:function(e){return x.ajax({url:e,type:"GET",dataType:"script",async:!1,global:!1,"throws":!0})}}),x.fn.extend({wrapAll:function(e){if(x.isFunction(e))return this.each(function(t){x(this).wrapAll(e.call(this,t))});if(this[0]){var t=x(e,this[0].ownerDocument).eq(0).clone(!0);this[0].parentNode&&t.insertBefore(this[0]),t.map(function(){var e=this;while(e.firstChild&&1===e.firstChild.nodeType)e=e.firstChild;return e}).append(this)}return this},wrapInner:function(e){return x.isFunction(e)?this.each(function(t){x(this).wrapInner(e.call(this,t))}):this.each(function(){var t=x(this),n=t.contents();n.length?n.wrapAll(e):t.append(e)})},wrap:function(e){var t=x.isFunction(e);return this.each(function(n){x(this).wrapAll(t?e.call(this,n):e)})},unwrap:function(){return this.parent().each(function(){x.nodeName(this,"body")||x(this).replaceWith(this.childNodes)}).end()}});var Pt,Rt,Wt,$t=/alpha\([^)]*\)/i,It=/opacity\s*=\s*([^)]*)/,zt=/^(top|right|bottom|left)$/,Xt=/^(none|table(?!-c[ea]).+)/,Ut=/^margin/,Vt=RegExp("^("+w+")(.*)$","i"),Yt=RegExp("^("+w+")(?!px)[a-z%]+$","i"),Jt=RegExp("^([+-])=("+w+")","i"),Gt={BODY:"block"},Qt={position:"absolute",visibility:"hidden",display:"block"},Kt={letterSpacing:0,fontWeight:400},Zt=["Top","Right","Bottom","Left"],en=["Webkit","O","Moz","ms"];function tn(e,t){if(t in e)return t;var n=t.charAt(0).toUpperCase()+t.slice(1),r=t,i=en.length;while(i--)if(t=en[i]+n,t in e)return t;return r}function nn(e,t){return e=t||e,"none"===x.css(e,"display")||!x.contains(e.ownerDocument,e)}function rn(e,t){var n,r,i,o=[],a=0,s=e.length;for(;s>a;a++)r=e[a],r.style&&(o[a]=x._data(r,"olddisplay"),n=r.style.display,t?(o[a]||"none"!==n||(r.style.display=""),""===r.style.display&&nn(r)&&(o[a]=x._data(r,"olddisplay",ln(r.nodeName)))):o[a]||(i=nn(r),(n&&"none"!==n||!i)&&x._data(r,"olddisplay",i?n:x.css(r,"display"))));for(a=0;s>a;a++)r=e[a],r.style&&(t&&"none"!==r.style.display&&""!==r.style.display||(r.style.display=t?o[a]||"":"none"));return e}x.fn.extend({css:function(e,n){return x.access(this,function(e,n,r){var i,o,a={},s=0;if(x.isArray(n)){for(o=Rt(e),i=n.length;i>s;s++)a[n[s]]=x.css(e,n[s],!1,o);return a}return r!==t?x.style(e,n,r):x.css(e,n)},e,n,arguments.length>1)},show:function(){return rn(this,!0)},hide:function(){return rn(this)},toggle:function(e){return"boolean"==typeof e?e?this.show():this.hide():this.each(function(){nn(this)?x(this).show():x(this).hide()})}}),x.extend({cssHooks:{opacity:{get:function(e,t){if(t){var n=Wt(e,"opacity");return""===n?"1":n}}}},cssNumber:{columnCount:!0,fillOpacity:!0,fontWeight:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,widows:!0,zIndex:!0,zoom:!0},cssProps:{"float":x.support.cssFloat?"cssFloat":"styleFloat"},style:function(e,n,r,i){if(e&&3!==e.nodeType&&8!==e.nodeType&&e.style){var o,a,s,l=x.camelCase(n),u=e.style;if(n=x.cssProps[l]||(x.cssProps[l]=tn(u,l)),s=x.cssHooks[n]||x.cssHooks[l],r===t)return s&&"get"in s&&(o=s.get(e,!1,i))!==t?o:u[n];if(a=typeof r,"string"===a&&(o=Jt.exec(r))&&(r=(o[1]+1)*o[2]+parseFloat(x.css(e,n)),a="number"),!(null==r||"number"===a&&isNaN(r)||("number"!==a||x.cssNumber[l]||(r+="px"),x.support.clearCloneStyle||""!==r||0!==n.indexOf("background")||(u[n]="inherit"),s&&"set"in s&&(r=s.set(e,r,i))===t)))try{u[n]=r}catch(c){}}},css:function(e,n,r,i){var o,a,s,l=x.camelCase(n);return n=x.cssProps[l]||(x.cssProps[l]=tn(e.style,l)),s=x.cssHooks[n]||x.cssHooks[l],s&&"get"in s&&(a=s.get(e,!0,r)),a===t&&(a=Wt(e,n,i)),"normal"===a&&n in Kt&&(a=Kt[n]),""===r||r?(o=parseFloat(a),r===!0||x.isNumeric(o)?o||0:a):a}}),e.getComputedStyle?(Rt=function(t){return e.getComputedStyle(t,null)},Wt=function(e,n,r){var i,o,a,s=r||Rt(e),l=s?s.getPropertyValue(n)||s[n]:t,u=e.style;return s&&(""!==l||x.contains(e.ownerDocument,e)||(l=x.style(e,n)),Yt.test(l)&&Ut.test(n)&&(i=u.width,o=u.minWidth,a=u.maxWidth,u.minWidth=u.maxWidth=u.width=l,l=s.width,u.width=i,u.minWidth=o,u.maxWidth=a)),l}):a.documentElement.currentStyle&&(Rt=function(e){return e.currentStyle},Wt=function(e,n,r){var i,o,a,s=r||Rt(e),l=s?s[n]:t,u=e.style;return null==l&&u&&u[n]&&(l=u[n]),Yt.test(l)&&!zt.test(n)&&(i=u.left,o=e.runtimeStyle,a=o&&o.left,a&&(o.left=e.currentStyle.left),u.left="fontSize"===n?"1em":l,l=u.pixelLeft+"px",u.left=i,a&&(o.left=a)),""===l?"auto":l});function on(e,t,n){var r=Vt.exec(t);return r?Math.max(0,r[1]-(n||0))+(r[2]||"px"):t}function an(e,t,n,r,i){var o=n===(r?"border":"content")?4:"width"===t?1:0,a=0;for(;4>o;o+=2)"margin"===n&&(a+=x.css(e,n+Zt[o],!0,i)),r?("content"===n&&(a-=x.css(e,"padding"+Zt[o],!0,i)),"margin"!==n&&(a-=x.css(e,"border"+Zt[o]+"Width",!0,i))):(a+=x.css(e,"padding"+Zt[o],!0,i),"padding"!==n&&(a+=x.css(e,"border"+Zt[o]+"Width",!0,i)));return a}function sn(e,t,n){var r=!0,i="width"===t?e.offsetWidth:e.offsetHeight,o=Rt(e),a=x.support.boxSizing&&"border-box"===x.css(e,"boxSizing",!1,o);if(0>=i||null==i){if(i=Wt(e,t,o),(0>i||null==i)&&(i=e.style[t]),Yt.test(i))return i;r=a&&(x.support.boxSizingReliable||i===e.style[t]),i=parseFloat(i)||0}return i+an(e,t,n||(a?"border":"content"),r,o)+"px"}function ln(e){var t=a,n=Gt[e];return n||(n=un(e,t),"none"!==n&&n||(Pt=(Pt||x("<iframe frameborder='0' width='0' height='0'/>").css("cssText","display:block !important")).appendTo(t.documentElement),t=(Pt[0].contentWindow||Pt[0].contentDocument).document,t.write("<!doctype html><html><body>"),t.close(),n=un(e,t),Pt.detach()),Gt[e]=n),n}function un(e,t){var n=x(t.createElement(e)).appendTo(t.body),r=x.css(n[0],"display");return n.remove(),r}x.each(["height","width"],function(e,n){x.cssHooks[n]={get:function(e,r,i){return r?0===e.offsetWidth&&Xt.test(x.css(e,"display"))?x.swap(e,Qt,function(){return sn(e,n,i)}):sn(e,n,i):t},set:function(e,t,r){var i=r&&Rt(e);return on(e,t,r?an(e,n,r,x.support.boxSizing&&"border-box"===x.css(e,"boxSizing",!1,i),i):0)}}}),x.support.opacity||(x.cssHooks.opacity={get:function(e,t){return It.test((t&&e.currentStyle?e.currentStyle.filter:e.style.filter)||"")?.01*parseFloat(RegExp.$1)+"":t?"1":""},set:function(e,t){var n=e.style,r=e.currentStyle,i=x.isNumeric(t)?"alpha(opacity="+100*t+")":"",o=r&&r.filter||n.filter||"";n.zoom=1,(t>=1||""===t)&&""===x.trim(o.replace($t,""))&&n.removeAttribute&&(n.removeAttribute("filter"),""===t||r&&!r.filter)||(n.filter=$t.test(o)?o.replace($t,i):o+" "+i)}}),x(function(){x.support.reliableMarginRight||(x.cssHooks.marginRight={get:function(e,n){return n?x.swap(e,{display:"inline-block"},Wt,[e,"marginRight"]):t}}),!x.support.pixelPosition&&x.fn.position&&x.each(["top","left"],function(e,n){x.cssHooks[n]={get:function(e,r){return r?(r=Wt(e,n),Yt.test(r)?x(e).position()[n]+"px":r):t}}})}),x.expr&&x.expr.filters&&(x.expr.filters.hidden=function(e){return 0>=e.offsetWidth&&0>=e.offsetHeight||!x.support.reliableHiddenOffsets&&"none"===(e.style&&e.style.display||x.css(e,"display"))},x.expr.filters.visible=function(e){return!x.expr.filters.hidden(e)}),x.each({margin:"",padding:"",border:"Width"},function(e,t){x.cssHooks[e+t]={expand:function(n){var r=0,i={},o="string"==typeof n?n.split(" "):[n];for(;4>r;r++)i[e+Zt[r]+t]=o[r]||o[r-2]||o[0];return i}},Ut.test(e)||(x.cssHooks[e+t].set=on)});var cn=/%20/g,pn=/\[\]$/,fn=/\r?\n/g,dn=/^(?:submit|button|image|reset|file)$/i,hn=/^(?:input|select|textarea|keygen)/i;x.fn.extend({serialize:function(){return x.param(this.serializeArray())},serializeArray:function(){return this.map(function(){var e=x.prop(this,"elements");return e?x.makeArray(e):this}).filter(function(){var e=this.type;return this.name&&!x(this).is(":disabled")&&hn.test(this.nodeName)&&!dn.test(e)&&(this.checked||!Ct.test(e))}).map(function(e,t){var n=x(this).val();return null==n?null:x.isArray(n)?x.map(n,function(e){return{name:t.name,value:e.replace(fn,"\r\n")}}):{name:t.name,value:n.replace(fn,"\r\n")}}).get()}}),x.param=function(e,n){var r,i=[],o=function(e,t){t=x.isFunction(t)?t():null==t?"":t,i[i.length]=encodeURIComponent(e)+"="+encodeURIComponent(t)};if(n===t&&(n=x.ajaxSettings&&x.ajaxSettings.traditional),x.isArray(e)||e.jquery&&!x.isPlainObject(e))x.each(e,function(){o(this.name,this.value)});else for(r in e)gn(r,e[r],n,o);return i.join("&").replace(cn,"+")};function gn(e,t,n,r){var i;if(x.isArray(t))x.each(t,function(t,i){n||pn.test(e)?r(e,i):gn(e+"["+("object"==typeof i?t:"")+"]",i,n,r)});else if(n||"object"!==x.type(t))r(e,t);else for(i in t)gn(e+"["+i+"]",t[i],n,r)}x.each("blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error contextmenu".split(" "),function(e,t){x.fn[t]=function(e,n){return arguments.length>0?this.on(t,null,e,n):this.trigger(t)}}),x.fn.extend({hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)},bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,r){return this.on(t,e,n,r)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)}});var mn,yn,vn=x.now(),bn=/\?/,xn=/#.*$/,wn=/([?&])_=[^&]*/,Tn=/^(.*?):[ \t]*([^\r\n]*)\r?$/gm,Cn=/^(?:about|app|app-storage|.+-extension|file|res|widget):$/,Nn=/^(?:GET|HEAD)$/,kn=/^\/\//,En=/^([\w.+-]+:)(?:\/\/([^\/?#:]*)(?::(\d+)|)|)/,Sn=x.fn.load,An={},jn={},Dn="*/".concat("*");try{yn=o.href}catch(Ln){yn=a.createElement("a"),yn.href="",yn=yn.href}mn=En.exec(yn.toLowerCase())||[];function Hn(e){return function(t,n){"string"!=typeof t&&(n=t,t="*");var r,i=0,o=t.toLowerCase().match(T)||[];if(x.isFunction(n))while(r=o[i++])"+"===r[0]?(r=r.slice(1)||"*",(e[r]=e[r]||[]).unshift(n)):(e[r]=e[r]||[]).push(n)}}function qn(e,n,r,i){var o={},a=e===jn;function s(l){var u;return o[l]=!0,x.each(e[l]||[],function(e,l){var c=l(n,r,i);return"string"!=typeof c||a||o[c]?a?!(u=c):t:(n.dataTypes.unshift(c),s(c),!1)}),u}return s(n.dataTypes[0])||!o["*"]&&s("*")}function _n(e,n){var r,i,o=x.ajaxSettings.flatOptions||{};for(i in n)n[i]!==t&&((o[i]?e:r||(r={}))[i]=n[i]);return r&&x.extend(!0,e,r),e}x.fn.load=function(e,n,r){if("string"!=typeof e&&Sn)return Sn.apply(this,arguments);var i,o,a,s=this,l=e.indexOf(" ");return l>=0&&(i=e.slice(l,e.length),e=e.slice(0,l)),x.isFunction(n)?(r=n,n=t):n&&"object"==typeof n&&(a="POST"),s.length>0&&x.ajax({url:e,type:a,dataType:"html",data:n}).done(function(e){o=arguments,s.html(i?x("<div>").append(x.parseHTML(e)).find(i):e)}).complete(r&&function(e,t){s.each(r,o||[e.responseText,t,e])}),this},x.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){x.fn[t]=function(e){return this.on(t,e)}}),x.extend({active:0,lastModified:{},etag:{},ajaxSettings:{url:yn,type:"GET",isLocal:Cn.test(mn[1]),global:!0,processData:!0,async:!0,contentType:"application/x-www-form-urlencoded; charset=UTF-8",accepts:{"*":Dn,text:"text/plain",html:"text/html",xml:"application/xml, text/xml",json:"application/json, text/javascript"},contents:{xml:/xml/,html:/html/,json:/json/},responseFields:{xml:"responseXML",text:"responseText",json:"responseJSON"},converters:{"* text":String,"text html":!0,"text json":x.parseJSON,"text xml":x.parseXML},flatOptions:{url:!0,context:!0}},ajaxSetup:function(e,t){return t?_n(_n(e,x.ajaxSettings),t):_n(x.ajaxSettings,e)},ajaxPrefilter:Hn(An),ajaxTransport:Hn(jn),ajax:function(e,n){"object"==typeof e&&(n=e,e=t),n=n||{};var r,i,o,a,s,l,u,c,p=x.ajaxSetup({},n),f=p.context||p,d=p.context&&(f.nodeType||f.jquery)?x(f):x.event,h=x.Deferred(),g=x.Callbacks("once memory"),m=p.statusCode||{},y={},v={},b=0,w="canceled",C={readyState:0,getResponseHeader:function(e){var t;if(2===b){if(!c){c={};while(t=Tn.exec(a))c[t[1].toLowerCase()]=t[2]}t=c[e.toLowerCase()]}return null==t?null:t},getAllResponseHeaders:function(){return 2===b?a:null},setRequestHeader:function(e,t){var n=e.toLowerCase();return b||(e=v[n]=v[n]||e,y[e]=t),this},overrideMimeType:function(e){return b||(p.mimeType=e),this},statusCode:function(e){var t;if(e)if(2>b)for(t in e)m[t]=[m[t],e[t]];else C.always(e[C.status]);return this},abort:function(e){var t=e||w;return u&&u.abort(t),k(0,t),this}};if(h.promise(C).complete=g.add,C.success=C.done,C.error=C.fail,p.url=((e||p.url||yn)+"").replace(xn,"").replace(kn,mn[1]+"//"),p.type=n.method||n.type||p.method||p.type,p.dataTypes=x.trim(p.dataType||"*").toLowerCase().match(T)||[""],null==p.crossDomain&&(r=En.exec(p.url.toLowerCase()),p.crossDomain=!(!r||r[1]===mn[1]&&r[2]===mn[2]&&(r[3]||("http:"===r[1]?"80":"443"))===(mn[3]||("http:"===mn[1]?"80":"443")))),p.data&&p.processData&&"string"!=typeof p.data&&(p.data=x.param(p.data,p.traditional)),qn(An,p,n,C),2===b)return C;l=p.global,l&&0===x.active++&&x.event.trigger("ajaxStart"),p.type=p.type.toUpperCase(),p.hasContent=!Nn.test(p.type),o=p.url,p.hasContent||(p.data&&(o=p.url+=(bn.test(o)?"&":"?")+p.data,delete p.data),p.cache===!1&&(p.url=wn.test(o)?o.replace(wn,"$1_="+vn++):o+(bn.test(o)?"&":"?")+"_="+vn++)),p.ifModified&&(x.lastModified[o]&&C.setRequestHeader("If-Modified-Since",x.lastModified[o]),x.etag[o]&&C.setRequestHeader("If-None-Match",x.etag[o])),(p.data&&p.hasContent&&p.contentType!==!1||n.contentType)&&C.setRequestHeader("Content-Type",p.contentType),C.setRequestHeader("Accept",p.dataTypes[0]&&p.accepts[p.dataTypes[0]]?p.accepts[p.dataTypes[0]]+("*"!==p.dataTypes[0]?", "+Dn+"; q=0.01":""):p.accepts["*"]);for(i in p.headers)C.setRequestHeader(i,p.headers[i]);if(p.beforeSend&&(p.beforeSend.call(f,C,p)===!1||2===b))return C.abort();w="abort";for(i in{success:1,error:1,complete:1})C[i](p[i]);if(u=qn(jn,p,n,C)){C.readyState=1,l&&d.trigger("ajaxSend",[C,p]),p.async&&p.timeout>0&&(s=setTimeout(function(){C.abort("timeout")},p.timeout));try{b=1,u.send(y,k)}catch(N){if(!(2>b))throw N;k(-1,N)}}else k(-1,"No Transport");function k(e,n,r,i){var c,y,v,w,T,N=n;2!==b&&(b=2,s&&clearTimeout(s),u=t,a=i||"",C.readyState=e>0?4:0,c=e>=200&&300>e||304===e,r&&(w=Mn(p,C,r)),w=On(p,w,C,c),c?(p.ifModified&&(T=C.getResponseHeader("Last-Modified"),T&&(x.lastModified[o]=T),T=C.getResponseHeader("etag"),T&&(x.etag[o]=T)),204===e||"HEAD"===p.type?N="nocontent":304===e?N="notmodified":(N=w.state,y=w.data,v=w.error,c=!v)):(v=N,(e||!N)&&(N="error",0>e&&(e=0))),C.status=e,C.statusText=(n||N)+"",c?h.resolveWith(f,[y,N,C]):h.rejectWith(f,[C,N,v]),C.statusCode(m),m=t,l&&d.trigger(c?"ajaxSuccess":"ajaxError",[C,p,c?y:v]),g.fireWith(f,[C,N]),l&&(d.trigger("ajaxComplete",[C,p]),--x.active||x.event.trigger("ajaxStop")))}return C},getJSON:function(e,t,n){return x.get(e,t,n,"json")},getScript:function(e,n){return x.get(e,t,n,"script")}}),x.each(["get","post"],function(e,n){x[n]=function(e,r,i,o){return x.isFunction(r)&&(o=o||i,i=r,r=t),x.ajax({url:e,type:n,dataType:o,data:r,success:i})}});function Mn(e,n,r){var i,o,a,s,l=e.contents,u=e.dataTypes;while("*"===u[0])u.shift(),o===t&&(o=e.mimeType||n.getResponseHeader("Content-Type"));if(o)for(s in l)if(l[s]&&l[s].test(o)){u.unshift(s);break}if(u[0]in r)a=u[0];else{for(s in r){if(!u[0]||e.converters[s+" "+u[0]]){a=s;break}i||(i=s)}a=a||i}return a?(a!==u[0]&&u.unshift(a),r[a]):t}function On(e,t,n,r){var i,o,a,s,l,u={},c=e.dataTypes.slice();if(c[1])for(a in e.converters)u[a.toLowerCase()]=e.converters[a];o=c.shift();while(o)if(e.responseFields[o]&&(n[e.responseFields[o]]=t),!l&&r&&e.dataFilter&&(t=e.dataFilter(t,e.dataType)),l=o,o=c.shift())if("*"===o)o=l;else if("*"!==l&&l!==o){if(a=u[l+" "+o]||u["* "+o],!a)for(i in u)if(s=i.split(" "),s[1]===o&&(a=u[l+" "+s[0]]||u["* "+s[0]])){a===!0?a=u[i]:u[i]!==!0&&(o=s[0],c.unshift(s[1]));break}if(a!==!0)if(a&&e["throws"])t=a(t);else try{t=a(t)}catch(p){return{state:"parsererror",error:a?p:"No conversion from "+l+" to "+o}}}return{state:"success",data:t}}x.ajaxSetup({accepts:{script:"text/javascript, application/javascript, application/ecmascript, application/x-ecmascript"},contents:{script:/(?:java|ecma)script/},converters:{"text script":function(e){return x.globalEval(e),e}}}),x.ajaxPrefilter("script",function(e){e.cache===t&&(e.cache=!1),e.crossDomain&&(e.type="GET",e.global=!1)}),x.ajaxTransport("script",function(e){if(e.crossDomain){var n,r=a.head||x("head")[0]||a.documentElement;return{send:function(t,i){n=a.createElement("script"),n.async=!0,e.scriptCharset&&(n.charset=e.scriptCharset),n.src=e.url,n.onload=n.onreadystatechange=function(e,t){(t||!n.readyState||/loaded|complete/.test(n.readyState))&&(n.onload=n.onreadystatechange=null,n.parentNode&&n.parentNode.removeChild(n),n=null,t||i(200,"success"))},r.insertBefore(n,r.firstChild)},abort:function(){n&&n.onload(t,!0)}}}});var Fn=[],Bn=/(=)\?(?=&|$)|\?\?/;x.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Fn.pop()||x.expando+"_"+vn++;return this[e]=!0,e}}),x.ajaxPrefilter("json jsonp",function(n,r,i){var o,a,s,l=n.jsonp!==!1&&(Bn.test(n.url)?"url":"string"==typeof n.data&&!(n.contentType||"").indexOf("application/x-www-form-urlencoded")&&Bn.test(n.data)&&"data");return l||"jsonp"===n.dataTypes[0]?(o=n.jsonpCallback=x.isFunction(n.jsonpCallback)?n.jsonpCallback():n.jsonpCallback,l?n[l]=n[l].replace(Bn,"$1"+o):n.jsonp!==!1&&(n.url+=(bn.test(n.url)?"&":"?")+n.jsonp+"="+o),n.converters["script json"]=function(){return s||x.error(o+" was not called"),s[0]},n.dataTypes[0]="json",a=e[o],e[o]=function(){s=arguments},i.always(function(){e[o]=a,n[o]&&(n.jsonpCallback=r.jsonpCallback,Fn.push(o)),s&&x.isFunction(a)&&a(s[0]),s=a=t}),"script"):t});var Pn,Rn,Wn=0,$n=e.ActiveXObject&&function(){var e;for(e in Pn)Pn[e](t,!0)};function In(){try{return new e.XMLHttpRequest}catch(t){}}function zn(){try{return new e.ActiveXObject("Microsoft.XMLHTTP")}catch(t){}}x.ajaxSettings.xhr=e.ActiveXObject?function(){return!this.isLocal&&In()||zn()}:In,Rn=x.ajaxSettings.xhr(),x.support.cors=!!Rn&&"withCredentials"in Rn,Rn=x.support.ajax=!!Rn,Rn&&x.ajaxTransport(function(n){if(!n.crossDomain||x.support.cors){var r;return{send:function(i,o){var a,s,l=n.xhr();if(n.username?l.open(n.type,n.url,n.async,n.username,n.password):l.open(n.type,n.url,n.async),n.xhrFields)for(s in n.xhrFields)l[s]=n.xhrFields[s];n.mimeType&&l.overrideMimeType&&l.overrideMimeType(n.mimeType),n.crossDomain||i["X-Requested-With"]||(i["X-Requested-With"]="XMLHttpRequest");try{for(s in i)l.setRequestHeader(s,i[s])}catch(u){}l.send(n.hasContent&&n.data||null),r=function(e,i){var s,u,c,p;try{if(r&&(i||4===l.readyState))if(r=t,a&&(l.onreadystatechange=x.noop,$n&&delete Pn[a]),i)4!==l.readyState&&l.abort();else{p={},s=l.status,u=l.getAllResponseHeaders(),"string"==typeof l.responseText&&(p.text=l.responseText);try{c=l.statusText}catch(f){c=""}s||!n.isLocal||n.crossDomain?1223===s&&(s=204):s=p.text?200:404}}catch(d){i||o(-1,d)}p&&o(s,c,p,u)},n.async?4===l.readyState?setTimeout(r):(a=++Wn,$n&&(Pn||(Pn={},x(e).unload($n)),Pn[a]=r),l.onreadystatechange=r):r()},abort:function(){r&&r(t,!0)}}}});var Xn,Un,Vn=/^(?:toggle|show|hide)$/,Yn=RegExp("^(?:([+-])=|)("+w+")([a-z%]*)$","i"),Jn=/queueHooks$/,Gn=[nr],Qn={"*":[function(e,t){var n=this.createTween(e,t),r=n.cur(),i=Yn.exec(t),o=i&&i[3]||(x.cssNumber[e]?"":"px"),a=(x.cssNumber[e]||"px"!==o&&+r)&&Yn.exec(x.css(n.elem,e)),s=1,l=20;if(a&&a[3]!==o){o=o||a[3],i=i||[],a=+r||1;do s=s||".5",a/=s,x.style(n.elem,e,a+o);while(s!==(s=n.cur()/r)&&1!==s&&--l)}return i&&(a=n.start=+a||+r||0,n.unit=o,n.end=i[1]?a+(i[1]+1)*i[2]:+i[2]),n}]};function Kn(){return setTimeout(function(){Xn=t}),Xn=x.now()}function Zn(e,t,n){var r,i=(Qn[t]||[]).concat(Qn["*"]),o=0,a=i.length;for(;a>o;o++)if(r=i[o].call(n,t,e))return r}function er(e,t,n){var r,i,o=0,a=Gn.length,s=x.Deferred().always(function(){delete l.elem}),l=function(){if(i)return!1;var t=Xn||Kn(),n=Math.max(0,u.startTime+u.duration-t),r=n/u.duration||0,o=1-r,a=0,l=u.tweens.length;for(;l>a;a++)u.tweens[a].run(o);return s.notifyWith(e,[u,o,n]),1>o&&l?n:(s.resolveWith(e,[u]),!1)},u=s.promise({elem:e,props:x.extend({},t),opts:x.extend(!0,{specialEasing:{}},n),originalProperties:t,originalOptions:n,startTime:Xn||Kn(),duration:n.duration,tweens:[],createTween:function(t,n){var r=x.Tween(e,u.opts,t,n,u.opts.specialEasing[t]||u.opts.easing);return u.tweens.push(r),r},stop:function(t){var n=0,r=t?u.tweens.length:0;if(i)return this;for(i=!0;r>n;n++)u.tweens[n].run(1);return t?s.resolveWith(e,[u,t]):s.rejectWith(e,[u,t]),this}}),c=u.props;for(tr(c,u.opts.specialEasing);a>o;o++)if(r=Gn[o].call(u,e,c,u.opts))return r;return x.map(c,Zn,u),x.isFunction(u.opts.start)&&u.opts.start.call(e,u),x.fx.timer(x.extend(l,{elem:e,anim:u,queue:u.opts.queue})),u.progress(u.opts.progress).done(u.opts.done,u.opts.complete).fail(u.opts.fail).always(u.opts.always)}function tr(e,t){var n,r,i,o,a;for(n in e)if(r=x.camelCase(n),i=t[r],o=e[n],x.isArray(o)&&(i=o[1],o=e[n]=o[0]),n!==r&&(e[r]=o,delete e[n]),a=x.cssHooks[r],a&&"expand"in a){o=a.expand(o),delete e[r];for(n in o)n in e||(e[n]=o[n],t[n]=i)}else t[r]=i}x.Animation=x.extend(er,{tweener:function(e,t){x.isFunction(e)?(t=e,e=["*"]):e=e.split(" ");var n,r=0,i=e.length;for(;i>r;r++)n=e[r],Qn[n]=Qn[n]||[],Qn[n].unshift(t)},prefilter:function(e,t){t?Gn.unshift(e):Gn.push(e)}});function nr(e,t,n){var r,i,o,a,s,l,u=this,c={},p=e.style,f=e.nodeType&&nn(e),d=x._data(e,"fxshow");n.queue||(s=x._queueHooks(e,"fx"),null==s.unqueued&&(s.unqueued=0,l=s.empty.fire,s.empty.fire=function(){s.unqueued||l()}),s.unqueued++,u.always(function(){u.always(function(){s.unqueued--,x.queue(e,"fx").length||s.empty.fire()})})),1===e.nodeType&&("height"in t||"width"in t)&&(n.overflow=[p.overflow,p.overflowX,p.overflowY],"inline"===x.css(e,"display")&&"none"===x.css(e,"float")&&(x.support.inlineBlockNeedsLayout&&"inline"!==ln(e.nodeName)?p.zoom=1:p.display="inline-block")),n.overflow&&(p.overflow="hidden",x.support.shrinkWrapBlocks||u.always(function(){p.overflow=n.overflow[0],p.overflowX=n.overflow[1],p.overflowY=n.overflow[2]}));for(r in t)if(i=t[r],Vn.exec(i)){if(delete t[r],o=o||"toggle"===i,i===(f?"hide":"show"))continue;c[r]=d&&d[r]||x.style(e,r)}if(!x.isEmptyObject(c)){d?"hidden"in d&&(f=d.hidden):d=x._data(e,"fxshow",{}),o&&(d.hidden=!f),f?x(e).show():u.done(function(){x(e).hide()}),u.done(function(){var t;x._removeData(e,"fxshow");for(t in c)x.style(e,t,c[t])});for(r in c)a=Zn(f?d[r]:0,r,u),r in d||(d[r]=a.start,f&&(a.end=a.start,a.start="width"===r||"height"===r?1:0))}}function rr(e,t,n,r,i){return new rr.prototype.init(e,t,n,r,i)}x.Tween=rr,rr.prototype={constructor:rr,init:function(e,t,n,r,i,o){this.elem=e,this.prop=n,this.easing=i||"swing",this.options=t,this.start=this.now=this.cur(),this.end=r,this.unit=o||(x.cssNumber[n]?"":"px")},cur:function(){var e=rr.propHooks[this.prop];return e&&e.get?e.get(this):rr.propHooks._default.get(this)},run:function(e){var t,n=rr.propHooks[this.prop];return this.pos=t=this.options.duration?x.easing[this.easing](e,this.options.duration*e,0,1,this.options.duration):e,this.now=(this.end-this.start)*t+this.start,this.options.step&&this.options.step.call(this.elem,this.now,this),n&&n.set?n.set(this):rr.propHooks._default.set(this),this}},rr.prototype.init.prototype=rr.prototype,rr.propHooks={_default:{get:function(e){var t;return null==e.elem[e.prop]||e.elem.style&&null!=e.elem.style[e.prop]?(t=x.css(e.elem,e.prop,""),t&&"auto"!==t?t:0):e.elem[e.prop]},set:function(e){x.fx.step[e.prop]?x.fx.step[e.prop](e):e.elem.style&&(null!=e.elem.style[x.cssProps[e.prop]]||x.cssHooks[e.prop])?x.style(e.elem,e.prop,e.now+e.unit):e.elem[e.prop]=e.now}}},rr.propHooks.scrollTop=rr.propHooks.scrollLeft={set:function(e){e.elem.nodeType&&e.elem.parentNode&&(e.elem[e.prop]=e.now)}},x.each(["toggle","show","hide"],function(e,t){var n=x.fn[t];x.fn[t]=function(e,r,i){return null==e||"boolean"==typeof e?n.apply(this,arguments):this.animate(ir(t,!0),e,r,i)}}),x.fn.extend({fadeTo:function(e,t,n,r){return this.filter(nn).css("opacity",0).show().end().animate({opacity:t},e,n,r)},animate:function(e,t,n,r){var i=x.isEmptyObject(e),o=x.speed(t,n,r),a=function(){var t=er(this,x.extend({},e),o);(i||x._data(this,"finish"))&&t.stop(!0)};return a.finish=a,i||o.queue===!1?this.each(a):this.queue(o.queue,a)},stop:function(e,n,r){var i=function(e){var t=e.stop;delete e.stop,t(r)};return"string"!=typeof e&&(r=n,n=e,e=t),n&&e!==!1&&this.queue(e||"fx",[]),this.each(function(){var t=!0,n=null!=e&&e+"queueHooks",o=x.timers,a=x._data(this);if(n)a[n]&&a[n].stop&&i(a[n]);else for(n in a)a[n]&&a[n].stop&&Jn.test(n)&&i(a[n]);for(n=o.length;n--;)o[n].elem!==this||null!=e&&o[n].queue!==e||(o[n].anim.stop(r),t=!1,o.splice(n,1));(t||!r)&&x.dequeue(this,e)})},finish:function(e){return e!==!1&&(e=e||"fx"),this.each(function(){var t,n=x._data(this),r=n[e+"queue"],i=n[e+"queueHooks"],o=x.timers,a=r?r.length:0;for(n.finish=!0,x.queue(this,e,[]),i&&i.stop&&i.stop.call(this,!0),t=o.length;t--;)o[t].elem===this&&o[t].queue===e&&(o[t].anim.stop(!0),o.splice(t,1));for(t=0;a>t;t++)r[t]&&r[t].finish&&r[t].finish.call(this);delete n.finish})}});function ir(e,t){var n,r={height:e},i=0;for(t=t?1:0;4>i;i+=2-t)n=Zt[i],r["margin"+n]=r["padding"+n]=e;return t&&(r.opacity=r.width=e),r}x.each({slideDown:ir("show"),slideUp:ir("hide"),slideToggle:ir("toggle"),fadeIn:{opacity:"show"},fadeOut:{opacity:"hide"},fadeToggle:{opacity:"toggle"}},function(e,t){x.fn[e]=function(e,n,r){return this.animate(t,e,n,r)}}),x.speed=function(e,t,n){var r=e&&"object"==typeof e?x.extend({},e):{complete:n||!n&&t||x.isFunction(e)&&e,duration:e,easing:n&&t||t&&!x.isFunction(t)&&t};return r.duration=x.fx.off?0:"number"==typeof r.duration?r.duration:r.duration in x.fx.speeds?x.fx.speeds[r.duration]:x.fx.speeds._default,(null==r.queue||r.queue===!0)&&(r.queue="fx"),r.old=r.complete,r.complete=function(){x.isFunction(r.old)&&r.old.call(this),r.queue&&x.dequeue(this,r.queue)},r},x.easing={linear:function(e){return e},swing:function(e){return.5-Math.cos(e*Math.PI)/2}},x.timers=[],x.fx=rr.prototype.init,x.fx.tick=function(){var e,n=x.timers,r=0;for(Xn=x.now();n.length>r;r++)e=n[r],e()||n[r]!==e||n.splice(r--,1);n.length||x.fx.stop(),Xn=t},x.fx.timer=function(e){e()&&x.timers.push(e)&&x.fx.start()},x.fx.interval=13,x.fx.start=function(){Un||(Un=setInterval(x.fx.tick,x.fx.interval))},x.fx.stop=function(){clearInterval(Un),Un=null},x.fx.speeds={slow:600,fast:200,_default:400},x.fx.step={},x.expr&&x.expr.filters&&(x.expr.filters.animated=function(e){return x.grep(x.timers,function(t){return e===t.elem}).length}),x.fn.offset=function(e){if(arguments.length)return e===t?this:this.each(function(t){x.offset.setOffset(this,e,t)});var n,r,o={top:0,left:0},a=this[0],s=a&&a.ownerDocument;if(s)return n=s.documentElement,x.contains(n,a)?(typeof a.getBoundingClientRect!==i&&(o=a.getBoundingClientRect()),r=or(s),{top:o.top+(r.pageYOffset||n.scrollTop)-(n.clientTop||0),left:o.left+(r.pageXOffset||n.scrollLeft)-(n.clientLeft||0)}):o},x.offset={setOffset:function(e,t,n){var r=x.css(e,"position");"static"===r&&(e.style.position="relative");var i=x(e),o=i.offset(),a=x.css(e,"top"),s=x.css(e,"left"),l=("absolute"===r||"fixed"===r)&&x.inArray("auto",[a,s])>-1,u={},c={},p,f;l?(c=i.position(),p=c.top,f=c.left):(p=parseFloat(a)||0,f=parseFloat(s)||0),x.isFunction(t)&&(t=t.call(e,n,o)),null!=t.top&&(u.top=t.top-o.top+p),null!=t.left&&(u.left=t.left-o.left+f),"using"in t?t.using.call(e,u):i.css(u)}},x.fn.extend({position:function(){if(this[0]){var e,t,n={top:0,left:0},r=this[0];return"fixed"===x.css(r,"position")?t=r.getBoundingClientRect():(e=this.offsetParent(),t=this.offset(),x.nodeName(e[0],"html")||(n=e.offset()),n.top+=x.css(e[0],"borderTopWidth",!0),n.left+=x.css(e[0],"borderLeftWidth",!0)),{top:t.top-n.top-x.css(r,"marginTop",!0),left:t.left-n.left-x.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent||s;while(e&&!x.nodeName(e,"html")&&"static"===x.css(e,"position"))e=e.offsetParent;return e||s})}}),x.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(e,n){var r=/Y/.test(n);x.fn[e]=function(i){return x.access(this,function(e,i,o){var a=or(e);return o===t?a?n in a?a[n]:a.document.documentElement[i]:e[i]:(a?a.scrollTo(r?x(a).scrollLeft():o,r?o:x(a).scrollTop()):e[i]=o,t)},e,i,arguments.length,null)}});function or(e){return x.isWindow(e)?e:9===e.nodeType?e.defaultView||e.parentWindow:!1}x.each({Height:"height",Width:"width"},function(e,n){x.each({padding:"inner"+e,content:n,"":"outer"+e},function(r,i){x.fn[i]=function(i,o){var a=arguments.length&&(r||"boolean"!=typeof i),s=r||(i===!0||o===!0?"margin":"border");return x.access(this,function(n,r,i){var o;return x.isWindow(n)?n.document.documentElement["client"+e]:9===n.nodeType?(o=n.documentElement,Math.max(n.body["scroll"+e],o["scroll"+e],n.body["offset"+e],o["offset"+e],o["client"+e])):i===t?x.css(n,r,s):x.style(n,r,i,s)},n,a?i:t,a,null)}})}),x.fn.size=function(){return this.length},x.fn.andSelf=x.fn.addBack,"object"==typeof module&&module&&"object"==typeof module.exports?module.exports=x:(e.jQuery=e.$=x,"function"==typeof define&&define.amd&&define("jquery",[],function(){return x}))})(window);
--- /dev/null
+/*
+Copyright (c) 2013 Intel Corporation.
+
+Redistribution and use in source and binary forms, with or without modification,
+are permitted provided that the following conditions are met:
+
+* Redistributions of works must retain the original copyright notice, this list
+ of conditions and the following disclaimer.
+* Redistributions in binary form must reproduce the original copyright notice,
+ this list of conditions and the following disclaimer in the documentation
+ and/or other materials provided with the distribution.
+* Neither the name of Intel Corporation nor the names of its contributors
+ may be used to endorse or promote products derived from this work without
+ specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY INTEL CORPORATION "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
+ARE DISCLAIMED. IN NO EVENT SHALL INTEL CORPORATION BE LIABLE FOR ANY DIRECT,
+INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING,
+BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
+OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE,
+EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Authors:
+ Wang, Jing <jing.j.wang@intel.com>
+
+*/
+$(function(){
+ try {
+ // Checks if a device supports bluetooth API or not
+ var shape = tizen.systeminfo.getCapability("http://tizen.org/feature/screen.shape");
+ console.log("Shape = " + shape);
+ //alert(" Shape = " + shape);
+ } catch (error) {
+ // alert("Error name: " + error.name + ", message: " + error.message);
+ console.log("Error name: " + error.name + ", message: " + error.message);
+ }
+
+ if(shape=="circle"){
+ $('body').css('max-width', '100%');
+ $('body').css('max-height', '100%');
+ $('body').css('background-color', 'white');
+ $('body').css('margin-top', '20%');
+ $('body').css('margin-bottom', '20%');
+ $('body').css('margin-left', '20%');
+ $('body').css('margin-right', '20%');
+ }
+});
+
+var STUB_PORT = "";
+var RESOURCE_DIR;
+$.ajax({
+ url:"/tmp/TCT_CONFIG",
+ data:{},
+ async:false,
+ success:function(data){
+ var regEx = /DEVICE_SUITE_TARGET_30=(.+)/i;
+ var path = regEx.exec(data);
+ RESOURCE_DIR = path[1];
+ }
+});
+$.ajax({
+ url:RESOURCE_DIR + "/tct/portconfigure.json",
+ dataType:"json",
+ data:{},
+ async:false,
+ success:function(data){
+ STUB_PORT = data[0]["STUB_PORT"];
+ }
+});
+(function (window){
+ function TestRunner() {
+ this.start = null;
+ this.ui = null;
+ this.submitResult = function () {};
+ this.report = function (result, message) {};
+ this.doTest = function () {};
+ }
+
+ TestRunner.prototype = (function () {
+ var index = -1;
+ var Tests = [];
+ var Testsuites = {};
+ var TestsuiteSums = {};
+ var TestsetSums = {};
+ var sum = newSummary();
+ var testContext = newTestContext();
+ function newSummary(sum) {
+ if (typeof sum === "undefined")
+ return {"TOTAL": 0, "PASS" : 0, "FAIL" : 0, "BLOCK" : 0, "NOTRUN" : 0};
+ return {"TOTAL": sum.TOTAL, "PASS": sum.PASS, "FAIL": sum.FAIL, "BLOCK": sum.BLOCK, "NOTRUN": sum.NOTRUN};
+ }
+ function newTestContext() {
+ return {start_time: null, prev_uri: "", uri: "", sub_index: 0, onload_delay: 0};
+ }
+ function getParms () {
+ var parms = {};
+ var items = location.search.substring(1).split('&');
+ for ( var i = 0, max = items.length; i < max; i++) {
+ var pos = items[i].indexOf('=');
+ if (pos > 0) {
+ var key = items[i].substring(0, pos);
+ var val = items[i].substring(pos + 1);
+ if (!parms[key]) {
+ var rawVal = decodeURI(val);
+ if (rawVal.indexOf(',') < 0)
+ parms[key] = rawVal;
+ else
+ parms[key] = rawVal.split(',');
+ }
+ } else
+ parms[items[i]] = 1;
+ }
+ return parms;
+ }
+ return {
+ constructor: TestRunner,
+ options: getParms(),
+ addTestsuite: function (testsuite, category) {
+ if (!category)
+ category = "default";
+ if (typeof Testsuites[category] === "undefined")
+ Testsuites[category] = [];
+ Testsuites[category].push(testsuite);
+ },
+
+ goNext: function () {
+ if (Tests.length === 0) return false;
+ if (index >= Tests.length) {
+ index = -1;
+ return false;
+ }
+ index++;
+ return true;
+ },
+
+ goPrev: function () {
+ if (Tests.length === 0) return false;
+ if (index < 0) {
+ index = Tests.length;
+ return false;
+ }
+ index--;
+ return true;
+ },
+
+ runAll: function () {
+ testContext = newTestContext();
+ VIEWFLAGS.add("batch");
+ this.ui.updateView(VIEWFLAGS.del("suite"));
+ this.testIndex(-1);
+ this.doTest();
+ },
+
+ cleanTests: function () {
+ Tests = [];
+ },
+
+ testIndex: function (ind) {
+ if (typeof ind === "undefined")
+ return index;
+ index = ind;
+ },
+
+ getTest: function (ind) {
+ if (typeof ind === "undefined")
+ ind = index;
+ return Tests[ind];
+ },
+
+ addTest: function (test) {
+ if (test instanceof Array)
+ Tests = Tests.concat(test);
+ else
+ Tests.push(test);
+ },
+
+ sumInit: function (num) {
+ if (typeof num === "undefined")
+ num = Tests.length;
+ sum.TOTAL = sum.NOTRUN = num;
+ sum.PASS = sum.FAIL = sum.BLOCK = 0;
+ },
+
+ sumUpdate: function (oldRes, newRes, set) {
+ if (oldRes !== null) {
+ sum[oldRes]--;
+ if (set !== null) TestsetSums[set][oldRes]--;
+ }
+ if (newRes !== null) {
+ sum[newRes]++;
+ if (set != null) TestsetSums[set][newRes]++;
+ }
+ },
+
+ checkResult: function (oTestDoc) {
+ var message = "";
+ if (!oTestDoc) {
+ this.report('FAIL', 'Test page crash');
+ return true;
+ }
+ // Handle sub-index test
+ if (testContext.sub_index > 0) {
+ var oRes = $(oTestDoc).find("table#results");
+ if (oRes.length == 0)
+ return false;
+ var ind = testContext.sub_index - 1;
+ var $n = $(oRes).find('tbody > tr').eq(ind);
+ if ($n.length == 0)
+ return false
+ var result = $n.children("td:eq(0)").text();
+ message = $n.children("td:eq(2)").text();
+ this.report(result.toUpperCase(), message);
+ return true;
+ }
+
+ var oPass = $(oTestDoc).find(".pass");
+ var oFail = $(oTestDoc).find(".fail");
+ // Qunit sub-cases
+ var oUnitRes = $(oTestDoc).find("ol.qunit-assert-list");
+ $(oUnitRes).find('li').each(function() {
+ message += "[assert]" + $(this).attr("class");
+ message += "[message]*" + $(this).children("span").text() + "\n";
+ });
+ // All tests pass
+ if (oPass.length > 0 && oFail.length == 0) {
+ this.report('PASS', message);
+ return true;
+ }
+ // Handle failed tests
+ if (oFail.length > 0) {
+ var oRes = $(oTestDoc).find("table#results");
+ $(oRes).find('tr.fail').each(function() {
+ message += " *" + $(this).children("td:eq(1)").text() + ": ";
+ message += $(this).children("td:eq(2)").text();
+ });
+ this.report('FAIL', message);
+ return true;
+ }
+ return false;
+ },
+
+ testInfo: function (ind) {
+ var info = "";
+ var tc = this.getTest();
+ if (!tc) return info;
+ info += "Test : (" + (index + 1) + "/" + sum.TOTAL + ") ";
+ info += tc.test_script_entry;
+ info += "\nPurpose: " + tc.purpose;
+ if (tc.pre_condition)
+ info += "\nPrecondition: " + tc.pre_condition;
+ if (tc.steps)
+ info += "\n" + tc.steps;
+ return info;
+ },
+
+ getTestCaseUrl: function () {
+ function getUriField(uri, param) {
+ var querys = uri.split("?")
+ if (querys.length <= 1)
+ return "";
+ uri = querys[1];
+ var start = uri.indexOf(param);
+ if (start == -1)
+ return "";
+ start += param.length + 1;
+ var end = uri.indexOf("&", start);
+ if (end == -1)
+ return uri.substring(start);
+ return uri.substring(start, end);
+ }
+ var tc = this.getTest();
+ if (!tc) return null;
+ var delay = tc.onload_delay;
+ if (delay)
+ testContext.onload_delay = parseInt(delay) * 1000;
+ else
+ testContext.onload_delay = 5000;
+
+ var uri = tc.test_script_entry;
+ if (typeof this.options.testprefix !== "undefined") {
+ var pos = uri.indexOf('http://');
+ if (pos !== 0)
+ uri = this.options.testprefix + uri
+ }
+ var val = getUriField(uri, "value");
+ if (val && tc.execution_type == "auto" && VIEWFLAGS.has("batch")) { // Need sub index in TC
+ testContext.sub_index = parseInt(val);
+ testContext.uri = uri.split("?")[0];
+ if (testContext.uri == testContext.prev_uri)
+ return "";
+ } else {
+ testContext.uri = uri;
+ testContext.sub_index = 0;
+ }
+ testContext.prev_uri = testContext.uri;
+ testContext.start_time = new Date();
+ return testContext.uri;
+ },
+
+ loadReady: function () {
+ if (!VIEWFLAGS.has("batch"))
+ return;
+ if (!this.ui.testComplete()){
+ if (testContext.onload_delay > 0){
+ var tval = 500;
+ var self = this;
+ setTimeout(function() {self.loadReady();}, tval);
+ testContext.onload_delay -= tval;
+ return
+ }
+ this.report("BLOCK", "Timeout");
+ }
+ this.doTest();
+ },
+
+ getListSum: function () {
+ var sumdata = "";
+ sumdata += "<p><table id='browse'><tr><th>Testsuite</th>";
+ sumdata += "<th>Total</th><th>Pass</th><th>Fail</th><th>Block</th></tr>";
+ $.each(TestsuiteSums, function (key, val){
+ sumdata += "<tr><td>" + key+ "</td>";
+ sumdata += "<td style='color:black;'>" + val.TOTAL + "</td>";
+ sumdata += "<td style='color:green;'>" + val.PASS + "</td>";
+ sumdata += "<td style='color:red;'>" + val.FAIL + "</td>";
+ sumdata += "<td style='color:orange;'>" + val.BLOCK + "</td></tr>";
+ });
+ sumdata += "</table>";
+ return sumdata;
+ },
+
+ getTestSum: function (include_set) {
+ var sumdata = "<section><h3>Total:" + sum.TOTAL
+ + " Pass:<span style='color:green;'>" + sum.PASS
+ + "</span> Fail:<span style='color:red;'>" + sum.FAIL
+ + "</span> Block:<span style='color:orange;'>" + sum.BLOCK
+ + "</span> Notrun:<span style='color:black;'>" + sum.NOTRUN
+ + "</span>";
+ if (this.options.notifyInfo) {
+ sumdata += "<span style='color:slateblue;'> " + this.options.notifyInfo + "</span>";
+ this.options.notifyInfo = "";
+ }
+ sumdata += "</h3></section>";
+ if (VIEWFLAGS.has("batch")) {
+ var tc = this.getTest();
+ if (tc) sumdata += "<h4><span style='background-color: wheat'>(#" + index + ") " + tc.id + "</span></h4>";
+ }
+ if (this.options.testsuite_name)
+ TestsuiteSums[this.options.testsuite_name] = newSummary(sum)
+ if (include_set) {
+ sumdata += "<p><table id='browse'><tr><th>Testset</th>";
+ sumdata += "<th>Total</th><th>Pass</th><th>Fail</th><th>Block</th></tr>";
+ $.each(TestsetSums, function (key, val){
+ sumdata += "<tr><td>" + key+ "</td>";
+ sumdata += "<td style='color:black;'>" + val.TOTAL + "</td>";
+ sumdata += "<td style='color:green;'>" + val.PASS + "</td>";
+ sumdata += "<td style='color:red;'>" + val.FAIL + "</td>";
+ sumdata += "<td style='color:orange;'>" + val.BLOCK + "</td></tr>";
+ });
+ sumdata += "</table>";
+ }
+ return sumdata;
+ },
+
+ getListInfo: function () {
+ function createList(category) {
+ var testList = "";
+ $.each(Testsuites[category], function (ind, val) {
+ testList += "<li><input type='checkbox' id='" + val + "'> <a href=''>" + val + "</a>" + "</li>";
+ });
+ return testList;
+ }
+ var data = "<html><head><style>.category{background: #cccccc;border: 1px solid #aaaaaa;} li{list-style-type: none; padding-left: 0.6em; padding-bottom:0.8em; font-size: 1.3em;}html{font-family:DejaVu Sans, Bitstream Vera Sans, Arial, Sans;}</style></head><body>";
+ $.each(Testsuites, function(key, val) {
+ data += "<section><h3 class='category'><input type='checkbox' id='" + key + "'> " + key + "</h3>"
+ data += createList(key) + "</section>";
+ });
+ data += "</body></html>";
+ return data;
+ },
+
+ getBrowseInfo: function () {
+ var failList = passList = blockList = notrunList = "";
+ function createTestList(tc, color, ind) {
+ var mtag = (tc.execution_type === "manual") ? "(M)" : "";
+ return "<li>" + mtag + "<a rel='" + ind + "' href='' style ='color:" + color + ";'>" + tc.id + "</a>" + "</li>";
+ }
+ TestsetSums = {};
+ $.each(Tests, function (ind, val) {
+ if (this.set === null)
+ this.set = "default";
+ if (typeof TestsetSums[this.set] === "undefined")
+ TestsetSums[this.set] = newSummary();
+ TestsetSums[this.set][this.result]++;
+ TestsetSums[this.set]["TOTAL"]++;
+ if (this.result == "FAIL")
+ failList += createTestList(this, "red", ind);
+ if (this.result == "PASS")
+ passList += createTestList(this, "green", ind);
+ if (this.result == "BLOCK")
+ blockList += createTestList(this, "orange", ind);
+ if (this.result == "NOTRUN")
+ notrunList += createTestList(this, "black", ind);
+ });
+ var data = "<html><head><style>ul li {padding-bottom:0.8em;font-size: 1.3em;}";
+ data += "html{font-family:DejaVu Sans, Bitstream Vera Sans, Arial, Sans;}</style></head><body>";
+ if (notrunList)
+ data += "<section><h3>Notrun</h3><ul>" + notrunList + "</ul></section>";
+ if (failList)
+ data += "<section><h3 style='color: red;'>Fail</h3><ul>" + failList + "</ul></section>";
+ if (blockList)
+ data += "<section><h3 style='color: orange;'>Block</h3><ul>" + blockList + "</ul></section>";
+ if (passList)
+ data += "<section><h3 style='color: green'>Pass</h3><ul>" + passList + "</ul></section>";
+ data += "</body></html>";
+ return data;
+ },
+
+ TestCase: function () {
+ return {
+ id: null,
+ test_script_entry: null,
+ execution_type: "manual",
+ result: "NOTRUN",
+ purpose: "",
+ set: null,
+ pre_condition: "",
+ onload_delay: 0,
+ steps: "",
+ data: null};
+ },
+
+ TestSuite: function () {
+ return {
+ id: null,
+ sum: null,
+ data: null};
+ }
+
+ };
+ }());
+ // Standalone test runner
+ var master_runner = new TestRunner();
+ master_runner.start = function (ui) {
+ function filter(xml, self) {
+ var set_ind = 0;
+ var manuals = [];
+ $(xml).find("set").each(function () {
+ var setname = $(this).attr("name");
+ if (!setname)
+ setname = "set" + set_ind;
+ $(this).find("testcase").each(function () {
+ var v = $(this).attr('execution_type');
+ if (self.options.execution_type && v != self.options.execution_type
+ && $.inArray(v, self.options.execution_type) < 0) {
+ $(this).remove();
+ return;
+ }
+ v = $(this).attr('priority');
+ if (self.options.priority && v != self.options.priority
+ && $.inArray(v, self.options.priority) < 0){
+ $(this).remove();
+ return;
+ }
+ var test = self.TestCase();
+ test.id = $(this).attr("id");
+ test.execution_type = $(this).attr("execution_type");
+ test.test_script_entry = $(this).find("test_script_entry").text();
+ test.purpose = $(this).attr("purpose");
+ test.pre_condition = $(this).find("pre_condition").text();
+ test.onload_delay = $(this).attr("onload_delay");
+ test.result = "NOTRUN";
+ test.set = setname;
+ test.data = this;
+ if (test.execution_type === "auto")
+ self.addTest(test);
+ else
+ manuals.push(test);
+ });
+ set_ind++;
+ });
+ self.addTest(manuals);
+ }
+
+ var self = this;
+ if (ui) ui.bind(self);
+ if (self.options.testsuite_name)
+ self.options.testsuite = "opt/" + self.options.testsuite_name + "/tests.xml";
+ if (!self.options.testsuite) {
+ $.getJSON(TESTLIST_FILE, function(data) {
+ for (var i = 0, imax = data.length; i < imax; i++) {
+ for (var j = 0, jmax = data[i].tests.length; j < jmax; j++)
+ self.addTestsuite(data[i].tests[j], data[i].category);
+ }
+ self.ui.list();
+ self.options.multiplex = true;
+ });
+ } else {
+ $.get(self.options.testsuite, null, function (xml) {
+ self.internal.xmldoc = xml;
+ filter(xml, self);
+ self.sumInit();
+ self.ui.browse();
+ setTimeout(function () {
+ if (self.options.autorun)
+ self.runAll();
+ }, 500);
+ }, "xml");
+ }
+ };
+
+ master_runner.doTest = function () {
+ var self = this, tc = null;
+ while (self.goNext()) {
+ tc = self.getTest();
+ if (!tc || tc.execution_type === "manual")
+ break;
+ self.ui.updateTestInfo(self.testInfo(), null, null);
+ self.ui.runTest(self.getTestCaseUrl());
+ return;
+ }
+ this.ui.updateView(VIEWFLAGS.del("batch"));
+ if (self.options.autorun) {
+ self.submitResult();
+ if (self.options.multiplex) {
+ self.ui.list();
+ return;
+ }
+ close_window();
+ return;
+ }
+ if (!tc) {
+ setTimeout(function () {self.ui.browse();}, 500);
+ return;
+ }
+ this.ui.updateTest();
+ };
+
+ master_runner.report = function (result, log) {
+ var tc = this.getTest();
+ if (!tc) return;
+ var oldresult = tc.result;
+ this.sumUpdate(oldresult, result, tc.set);
+ tc.result = result;
+ $(tc.data).find('result_info').remove();
+ $(tc.data).attr('result', result);
+ var doc = $.parseXML("<result_info><actual_result>" + result +
+ "</actual_result><stdout>" +
+ escape_html(log) + "</stdout></result_info>");
+ $(tc.data).append(doc.documentElement);
+ if (VIEWFLAGS.has("batch")) result = null;
+ this.ui.updateTestInfo(null, this.getTestSum(false), result);
+ };
+
+ master_runner.submitResult = function () {
+ var SERVER = "http://127.0.0.1:8080";
+ var contents = (new XMLSerializer()).serializeToString(this.internal.xmldoc);
+ var resfile = "tests.res.xml";
+ if (this.options.testsuite_name)
+ resfile = this.options.testsuite_name + "." + resfile;
+ $.post(SERVER + "/save_file", {filename: resfile, data: contents})
+ };
+
+ master_runner.internal = {xmldoc: null};
+
+ // Controlled test runner
+ var slave_runner = new TestRunner();
+ slave_runner.start = function (ui) {
+ function sync_session_id() {
+ $.get(SERVER + "/init_session_id?session_id="
+ + self.internal.session_id);
+ }
+ var self = this;
+ self.internal.session_id = Math.round(Math.random() * 10000);
+ sync_session_id();
+ var next_step = self.internal.get_json("ask_next_step");
+ if (!next_step || next_step.step != "continue") {
+ close_window();
+ return false;
+ }
+ ui.bind(self);
+ var f = function () {
+ var p = self.internal.get_json("check_execution_progress");
+ if (p) self.sumInit(parseInt(p.total));
+ self.doTest();
+ };
+ self.ui.updateView(VIEWFLAGS.add("batch"));
+ self.ui.updateView(VIEWFLAGS.del("suite"));
+ setTimeout(f, 1000);
+ return true;
+ };
+
+ slave_runner.doTest = function () {
+ var self = this;
+ if (self.internal.stage > 0) {
+ self.ui.updateView(VIEWFLAGS.del("batch"));
+ self.goNext();
+ self.ui.updateTest();
+ return;
+ }
+ var next_step = self.internal.get_json("ask_next_step");
+ if (next_step && next_step.step == "continue") {
+ var task = self.internal.get_json("auto_test_task");
+ if (task === null) {
+ print_error("ask_test_task", "Fail get task");
+ } else if (task.invalid === 0) {
+ print_error("ask_test_task", "Invalid session");
+ } else if (task.stop === 0) {
+ print_error("ask_test_task", "close window");
+ } else if (task.none !== 0) { //handle auto test
+ var test = self.TestCase();
+ test.id = task.case_id;
+ test.onload_delay = task.onload_delay;
+ test.test_script_entry = task.entry;
+ test.execution_type = "auto";
+ test.purpose = task.purpose;
+ test.pre_condition = task.pre_condition;
+ self.addTest(test);
+ self.goNext();
+ self.ui.updateTestInfo(self.testInfo(), null, null);
+ self.ui.runTest(self.getTestCaseUrl());
+ return;
+ } else { //handle manual test
+ self.ui.updateView(VIEWFLAGS.del("batch"));
+ self.internal.stage = 1;
+ var mtask = self.internal.get_json("manual_cases");
+ if (mtask && mtask.none != 0) {
+ self.cleanTests();
+ for (var i = 0, max = mtask.length; i < max; i++) {
+ var test = self.TestCase();
+ test.id = mtask[i].case_id;
+ test.test_script_entry = mtask[i].entry;
+ test.purpose = mtask[i].purpose;
+ test.pre_condition = mtask[i].pre_condition;
+ test.result = "NOTRUN";
+ test.execution_type = "manual";
+ test.index = i;
+ var steps = "";
+ $(mtask[i].steps).each(function () {
+ steps += "Step-" + this.order + "\t: " + this.step_desc + "\n";
+ steps += "Expect\t: " + this.expected + "\n";
+ });
+ test.steps = steps;
+ self.addTest(test);
+ }
+ self.ui.updateTest(-1);
+ self.sumInit();
+ self.ui.browse();
+ } else
+ close_window();
+ return;
+ }
+ }
+ close_window();
+ };
+
+ slave_runner.report = function(result, log) {
+ var tc = this.getTest();
+ var oldresult;
+ if (this.internal.stage > 0) {
+ this.internal.post_json("commit_manual_result",
+ {"case_id": tc.id, "result": result});
+ oldresult = tc.result
+ tc.result = result;
+ } else {
+ this.internal.post_json("commit_result",
+ { "case_id" : tc.id,
+ "result" : result,
+ "msg" : "[Message]" + log,
+ "session_id" : this.internal.session_id});
+ oldresult = "NOTRUN";
+ }
+ this.sumUpdate(oldresult, result, null);
+ if (VIEWFLAGS.has("batch")) result = null;
+ this.ui.updateTestInfo(null, this.getTestSum(false), result);
+ };
+
+ slave_runner.submitResult = function () {
+ $.get(SERVER + "/generate_xml");
+ };
+
+ slave_runner.internal = {
+ session_id: null,
+ stage: 0,
+ get_json: function (name) {
+ var jsondata = null;
+ $.getJSON(SERVER + "/" + name + "?session_id="
+ + this.session_id, function(data) {
+ jsondata = data;});
+ return jsondata; },
+ post_json: function (name, d) {
+ $.post(SERVER + "/" + name, d, null, "json");
+ }
+ };
+
+ var i_ui = (function () {
+ var testinfo = $("#testinfo").get(0);
+ var frmTest = $("#frmTest").get(0);
+ var textTest = $("#textTest").get(0);
+ var btnPass = $("#btnPass").get(0);
+ var btnFail = $("#btnFail").get(0);
+ var btnBlock = $("#btnBlock").get(0);
+ var btnExit = $("#btnExit").get(0);
+ var btnNext = $("#btnNext").get(0);
+ var btnPrev = $("#btnPrev").get(0);
+ var btnRun = $("#btnRun").get(0);
+ var divSum = $("#divSum").get(0);
+ var btnBack = $("#btnBack").get(0);
+ var btnSave = $("#btnSave").get(0);
+ var runner = null;
+ var listmode = null;
+ var nextTest = function () {
+ runner.goNext();
+ selectTest();
+ };
+
+ var prevTest = function() {
+ runner.goPrev();
+ selectTest();
+ };
+
+ var selectResult = function() {
+ runner.report(this.value, "");
+ };
+
+ var selectTest = function () {
+ frmTest.src = "";
+ var tc = runner.getTest();
+ if (!tc) {
+ if (runner.testIndex() === -1)
+ textTest.value = "---Begin---";
+ else
+ textTest.value = "---End---";
+ changeColor("NOTRUN");
+ return;
+ }
+ testinfo.value = runner.testInfo();
+ $(divSum).html(runner.getTestSum(false));
+ textTest.value = ((tc.execution_type === "manual") ? "(M)" : "") + tc.id;
+ changeColor(tc.result);
+ };
+
+ function changeColor(result) {
+ if (result === "PASS")
+ $(textTest).css("backgroundColor", "lightgreen");
+ else if (result === "FAIL")
+ $(textTest).css("backgroundColor", "tomato");
+ else if (result === "BLOCK")
+ $(textTest).css("backgroundColor", "yellow");
+ else
+ $(textTest).css("backgroundColor", "white");
+ }
+
+ return {
+ bind: function (r) {
+ var self = this;
+ r.ui = self;
+ runner = r;
+ $(btnPass).on("click", selectResult);
+ $(btnFail).on("click", selectResult);
+ $(btnBlock).on("click", selectResult);
+ $(btnNext).on("click", nextTest);
+ $(btnPrev).on("click", prevTest);
+ $(btnRun).on("click", function () {
+ if (VIEWFLAGS.has("list")) {
+ runner.options.auto_testsuites = [];
+ var tdoc = frmTest.contentWindow.document;
+ $(tdoc).find("section li>input:checked").each(function () {
+ var tname = $(this).attr("id");
+ runner.options.auto_testsuites.push(tname);
+ });
+ self.list();
+ } else if (VIEWFLAGS.has("suite")) {
+ runner.runAll();
+ } else
+ self.runTest(runner.getTestCaseUrl());
+ });
+ $(frmTest).on("load", function () {runner.loadReady();});
+ $(btnExit).on("click", function () {
+ runner.submitResult();
+ if (runner.options.multiplex && VIEWFLAGS.has("suite"))
+ self.list();
+ else
+ close_window();
+ });
+ $(btnBack).on("click", function () {
+ frmTest.src = "";
+ setTimeout(function () {self.browse();}, 300);
+ });
+ $(btnSave).on("click", function () {
+ runner.submitResult();
+ runner.options.notifyInfo = "*Save succeed*";
+ $(divSum).html(runner.getTestSum(true));
+ });
+ frmTest.height = $(window).height();
+ },
+
+ list: function () {
+ var tdoc = frmTest.contentWindow.document;
+ $(btnExit).attr("value", "Exit");
+ tdoc.open("text/html", "replace");
+ tdoc.writeln(runner.getListInfo());
+ var self = this;
+ $(tdoc).find("section li>a").on("click", function (e) {
+ runner.options.testsuite_name = $(this).text();
+ VIEWFLAGS.del("list");
+ runner.start();
+ window.scrollTo(0, 0);
+ e.preventDefault();
+ });
+ $(tdoc).find("section h3>input[type=checkbox]").on("click", function () {
+ $boxs = $(this).parent().parent().find("li>input[type=checkbox]");
+ $boxs.prop('checked', $(this).is(':checked'));
+ });
+ $(divSum).html(runner.getListSum());
+ runner.cleanTests();
+ self.updateView(VIEWFLAGS.add("list"));
+ if (runner.options.auto_testsuites) {
+ if (runner.options.auto_testsuites.length > 0) {
+ var ts = runner.options.auto_testsuites.shift();
+ runner.options.testsuite_name = ts;
+ runner.options.autorun = true;
+ VIEWFLAGS.del("list");
+ runner.start();
+ } else
+ runner.options.autorun = false;
+ }
+ },
+
+ browse: function () {
+ var tdoc = frmTest.contentWindow.document;
+ if (runner.options.multiplex)
+ $(btnExit).attr("value", "Back");
+ tdoc.open("text/html", "replace");
+ tdoc.writeln(runner.getBrowseInfo());
+ var self = this;
+ $(tdoc).find("section ul li>a").on("click", function (e) {
+ var ind = parseInt($(this).attr("rel"));
+ self.updateView(VIEWFLAGS.del("suite"));
+ self.updateTest(ind);
+ window.scrollTo(0, 0);
+ e.preventDefault();
+ });
+ $(divSum).html(runner.getTestSum(true));
+ self.updateView(VIEWFLAGS.add("suite"));
+ },
+
+ updateTest: function (ind) {
+ if (typeof ind !== "undefined") runner.testIndex(ind);
+ selectTest();
+ },
+
+ updateView: function (flags) {
+ if (flags & VIEWFLAGS.flags.batch)
+ $(".batchhide").hide();
+ else {
+ $(".batchhide").show();
+ if (flags & VIEWFLAGS.flags.list) {
+ $(".tchide").show();
+ $(".suitehide").show();
+ $(".listhide").hide();
+ } else if (flags & VIEWFLAGS.flags.suite) {
+ $(".listhide").show();
+ $(".tchide").show();
+ $(".suitehide").hide();
+ } else {
+ $(".listhide").show();
+ $(".suitehide").show();
+ $(".tchide").hide();
+ }
+ }
+ },
+
+ testComplete: function () {
+ return runner.checkResult(frmTest.contentWindow.document);
+ },
+
+ runTest: function (uri) {
+ if (uri === null) return;
+ if (uri)
+ frmTest.src = uri;
+ else
+ runner.loadReady();
+ },
+
+ updateTestInfo: function (info, sum, result) {
+ if (info !== null)
+ testinfo.value = info;
+ if (sum !== null)
+ $(divSum).html(sum);
+ if (result !== null)
+ changeColor(result);
+ },
+ };
+ } ());
+
+ function escape_html(s) {
+ return s.replace(/\&/g, "&").replace(/</g, "<").replace(/"/g,
+ """).replace(/'/g, "'");
+ }
+
+ function print_error(command, message) {
+ console.warn("Command -" + command + ": " + message);
+ }
+
+ function close_window() {
+ setTimeout(function () {
+ window.open('', '_self', '');
+ window.close();
+ if (window.parent != window.self) {
+ window.parent.onbeforeunload = null;
+ window.parent.close();
+ }
+ }, 1000);
+ }
+
+ function pre_init() {
+ var runner_ok = false;
+ $.get(SERVER + "/check_server", function () {
+ runner_ok = slave_runner.start(i_ui);
+ });
+ if (!runner_ok)
+ master_runner.start(i_ui);
+ }
+ var SERVER = "http://127.0.0.1:8000";
+ var TESTLIST_FILE = "testlist.json"
+ var VIEWFLAGS = { val: 0,
+ flags: {suite: 1, batch: 2, list: 4},
+ add: function (f) { this.val |= this.flags[f]; return this.val},
+ del: function (f) { this.val &= ~this.flags[f]; return this.val},
+ has: function (f) { return this.val & this.flags[f];},
+ };
+ $.ajaxSetup({ async: false});
+ $(window).on("ready", pre_init);
+})(window);
projects / test / tct / web / api.git / commitdiff
