+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>CSS Backgrounds and Borders Test: background-repeat - one round keyword value</title>
- <link rel="author" title="Intel" href="http://www.intel.com">
- <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-08 -->
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-repeat">
- <meta name="flags" content="image">
- <meta name="assert" content="Check if 'background-repeat' is 'round', then the width and height of the corresponding background image is rescaled so that they fit a whole number of times (2 in this test) in the background positioning area. Therefore the used width and height of the background image in this test should be 110px.">
- <style>
- div {
- background-color: red;
- background-image: url(support/cat.png); /* 98px wide by 99px tall */
- background-repeat: round; /* round round */
- height: 220px;
- width: 220px;
-
- /*
- Background positioning area is 220px wide by 220px tall.
- So, the height of the image is rounded to 110px, [220px / rounded (220px / 99px)]
- and the width of the image is rounded to 110px, [220px / rounded (220px / 98px)].
- */
- }
- </style>
- </head>
- <body>
- <p>Test passes if there is 2 rows of 2 cats and if there is <strong>no partially</strong> displayed cat and <strong>no red</strong>.</p>
- <div></div>
- </body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>CSS Backgrounds and Borders Test: background-size 'auto 61px' with background-repeat 'round'</title>
- <link rel="author" title="Intel" href="http://www.intel.com">
- <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-15 -->
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" title="3.9. Sizing Images: the 'background-size' property">
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-repeat" title="3.4. Tiling Images: the 'background-repeat' property">
- <link rel="match" href="reference/background-size-025-ref.xht">
-
- <meta name="flags" content="image">
- <meta name="assert" content="Check if 'background-size' is 'auto 61px' and 'background-repeat' is 'round', then the height of the corresponding background image is rounded (70px in this test) so that it fits a whole number of times (3 in this test) in the background positioning area, and the width of the background image is rescaled (70px in this test) to keep the original aspect ratio.">
- <style>
- div {
- background-color: red;
- background-image: url("support/100x100-blue-and-orange.png");
- background-repeat: round; /* round round */
- background-size: auto 61px;
- height: 210px;
- width: 210px;
-
- /*
- Background positioning area is 210px wide by 210px tall.
- The set background size height is 61px. But because
- background repeat is round, then the background image
- is rescaled as follows:
- Newest height = 210px / (round [210px / 61px]);
- Newest height = 210px / (round [3.44]);
- Newest height = 210px / (3);
- Newest height = 70px;
-
- The width is rescaled to 70px to keep the original aspect ratio.
- */
- }
- </style>
- </head>
- <body>
- <p>Test passes if there is 3 rows of 3 blue-and-orange squares and if there is <strong>no partially</strong> displayed squares and <strong>no red</strong>.</p>
-
- <div></div>
- </body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>CSS Backgrounds and Borders Test: background-size '52px auto' with background-repeat 'repeat round'</title>
- <link rel="author" title="Intel" href="http://www.intel.com">
- <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-15 -->
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" title="3.9. Sizing Images: the 'background-size' property">
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-repeat" title="3.4. Tiling Images: the 'background-repeat' property">
- <link rel="match" href="reference/background-size-027-ref.xht">
-
- <meta name="flags" content="image">
- <meta name="assert" content="Check if 'background-size' is '52px auto' and 'background-repeat' is 'repeat round', then the width of the corresponding background image is 52px and then repeated while the height is first rescaled from 100px to 52px to keep the original image aspect ratio and then to 60px due to 'round'.">
- <style>
- div {
- background-color: red;
- background-image: url(support/100x100-blue-and-orange.png);
- background-repeat: repeat round;
- background-size: 52px auto;
- height: 180px;
- width: 156px;
-
- /*
- Background positioning area is 156px wide by 180px tall.
- The width of the background image is 52px.
- So, the height is rescaled to 52px to keep the original aspect ratio.
- Then, because background-repeat is set to repeat round, the
- height is rescaled as following:
- Newest height = 180px / (round [180px / 52px]);
- Newest height = 180px / (round [3.46]);
- Newest height = 180px / (3);
- Newest height = 60px;
- */
- }
- </style>
- </head>
- <body>
- <p>Test passes if there is 3 rows of 3 blue-and-orange rectangles and if there is <strong>no partially</strong> displayed rectangles and <strong>no red</strong>.</p>
-
- <div></div>
- </body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>CSS Backgrounds and Borders Test: background-size '52px auto' with background-repeat 'round repeat'</title>
- <link rel="author" title="Intel" href="http://www.intel.com">
- <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-15 -->
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" title="3.9. Sizing Images: the 'background-size' property">
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-repeat" title="3.4. Tiling Images: the 'background-repeat' property">
- <link rel="match" href="reference/background-size-029-ref.xht">
-
- <meta name="flags" content="image">
- <meta name="assert" content="Check if 'background-size' is '52px auto' and 'background-repeat' is 'round repeat', then the width is first rescaled to from 100px to 52px and then rescaled to 60px due to 'round' and the height of the corresponding background image is rescaled from 100px to 60px (to keep the original image aspect ratio) and then repeated vertically.">
- <style>
- div {
- background-color: red;
- background-image: url(support/100x100-blue-and-orange.png);
- background-repeat: round repeat;
- background-size: 52px auto;
- height: 180px;
- width: 180px;
-
- /*
- Background positioning area is 180px wide by 180px tall.
- The width of the background image is 52px.
- But, because background-repeat is set to round repeat, the
- width is rescaled as following:
- Newest width = 180px / (round [180px / 52px]);
- Newest width = 180px / (round [3.46]);
- Newest width = 180px / (3);
- Newest width = 60px;
-
- Then the height is rescaled to from 100px to 60px to keep
- the original aspect ratio.
- */
- }
- </style>
- </head>
- <body>
- <p>Test passes if there is 3 rows of 3 blue-and-orange squares and if there is <strong>no partially</strong> displayed squares and <strong>no red</strong>.</p>
-
- <div></div>
- </body>
-</html>
+++ /dev/null
-<!DOCTYPE html>
-<html>
- <head>
- <title>CSS Backgrounds and Borders Test: background-size '20% 30%' with background-repeat 'no-repeat round'</title>
- <link rel="author" title="Intel" href="http://www.intel.com">
- <link rel="reviewer" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> <!-- 2012-11-17 -->
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" title="3.9. Sizing Images: the 'background-size' property">
- <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-repeat" title="3.4. Tiling Images: the 'background-repeat' property">
- <link rel="match" href="reference/background-size-031-ref.xht">
-
- <meta name="flags" content="image">
- <meta name="assert" content="Check if 'background-size' is '20% 30%' and 'background-repeat' is 'no-repeat round', then the height of the corresponding background image is 50px so that it fits a whole number of times (3 in this test) in the background positioning area, and the width of the background image is rescaled to 20% (50px in this test) of the background area.">
- <style>
- #ref-overlapped-red {
- background-color: red;
- height: 150px;
- width: 50px;
- }
- #test-overlapping-square {
- background-image: url(support/100x100-blue-and-orange.png);
- background-repeat: no-repeat round;
- background-size: 20% 30%;
- bottom: 150px;
- height: 150px;
- position: relative;
- width: 250px;
- }
- /*
- Background positioning area is 250px wide by 150px tall.
- The width of the background image is 20% of 250px == 50px.
- The height is rescaled to 30% of 150px == 45px.
- Then, because background-repeat is set to no-repeat round, the
- height is rescaled as following:
- Newest height = 150px / (round [150px / 45px]);
- Newest height = 150px / (round [3.33]);
- Newest height = 150px / (3);
- Newest height = 50px;
- */
- </style>
- </head>
- <body>
- <p>Test passes if there is 1 column of 3 blue-and-orange squares and if there is <strong>no partially</strong> displayed square and <strong>no red</strong>.</p>
-
- <div id="ref-overlapped-red"></div>
- <div id="test-overlapping-square"></div>
- </body>
-</html>
</spec>
</specs>
</testcase>
- <testcase purpose="Check if background-repeat with round display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-repeat-round-001">
- <description>
- <pre_condition/>
- <post_condition/>
- <steps>
- <step order="1">
- <step_desc>Check if background-repeat with round display correctly in visual</step_desc>
- <expected>there is 2 rows of 2 cats and if there is no partially displayed cat and no red</expected>
- </step>
- </steps>
- <test_script_entry>/opt/tct-backgrounds-css3-tests/backgrounds/csswg/background-repeat-round-001.html</test_script_entry>
- </description>
- <specs>
- <spec>
- <spec_assertion element_type="property" element_name="background-repeat" interface="CSS" specification="CSS Backgrounds and Borders Module Level 3 (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
- <spec_url>http://www.w3.org/TR/2012/CR-css3-background-20120724/#the-background-repeat</spec_url>
- <spec_statement/>
- </spec>
- </specs>
- </testcase>
<testcase purpose="Check if background-size with initial value display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-002">
<description>
<pre_condition/>
</spec>
</specs>
</testcase>
- <testcase purpose="Check if background-size with 'auto 61px' and background-repeat with 'round' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="Background-size-025">
- <description>
- <pre_condition/>
- <post_condition/>
- <steps>
- <step order="1">
- <step_desc>Check if background-size with 'auto 61px' and background-repeat with 'round' display correctly in visual</step_desc>
- <expected>there is 3 rows of 3 blue-and-orange squares and if there is no partially displayed squares and no red</expected>
- </step>
- </steps>
- <test_script_entry>/opt/tct-backgrounds-css3-tests/backgrounds/csswg/background-size-025.html</test_script_entry>
- </description>
- <specs>
- <spec>
- <spec_assertion element_type="property" element_name="background-size" interface="CSS" specification="CSS Backgrounds and Borders Module Level 3 (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
- <spec_url>http://www.w3.org/TR/2012/CR-css3-background-20120724/#the-background-size</spec_url>
- <spec_statement/>
- </spec>
- </specs>
- </testcase>
<testcase purpose="Check if background-size with 'auto' and background-repeat with 'repeat' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-026">
<description>
<pre_condition/>
</spec>
</specs>
</testcase>
- <testcase purpose="Check if background-size with '52px auto'' and background-repeat with 'repeat round' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-027">
- <description>
- <pre_condition/>
- <post_condition/>
- <steps>
- <step order="1">
- <step_desc>Check if background-size with '52px auto'' and background-repeat with 'repeat round' display correctly in visual</step_desc>
- <expected>there is 3 rows of 3 blue-and-orange rectangles and if there is no partially displayed rectangles and no red</expected>
- </step>
- </steps>
- <test_script_entry>/opt/tct-backgrounds-css3-tests/backgrounds/csswg/background-size-027.html</test_script_entry>
- </description>
- <specs>
- <spec>
- <spec_assertion element_type="property" element_name="background-size" interface="CSS" specification="CSS Backgrounds and Borders Module Level 3 (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
- <spec_url>http://www.w3.org/TR/2012/CR-css3-background-20120724/#the-background-size</spec_url>
- <spec_statement/>
- </spec>
- </specs>
- </testcase>
<testcase purpose="Check if background-size with '50px' and background-repeat with 'repeat' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-028">
<description>
<pre_condition/>
</spec>
</specs>
</testcase>
- <testcase purpose="Check if background-size with '52px auto' and background-repeat with 'round repeat' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="Background-size-029">
- <description>
- <pre_condition/>
- <post_condition/>
- <steps>
- <step order="1">
- <step_desc>Check if background-size with '52px auto' and background-repeat with 'round repeat' display correctly in visual</step_desc>
- <expected>there is 3 rows of 3 blue-and-orange squares and if there is no partially displayed squares and no red</expected>
- </step>
- </steps>
- <test_script_entry>/opt/tct-backgrounds-css3-tests/backgrounds/csswg/background-size-029.html</test_script_entry>
- </description>
- <specs>
- <spec>
- <spec_assertion element_type="property" element_name="background-size" interface="CSS" specification="CSS Backgrounds and Borders Module Level 3 (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
- <spec_url>http://www.w3.org/TR/2012/CR-css3-background-20120724/#the-background-size</spec_url>
- <spec_statement/>
- </spec>
- </specs>
- </testcase>
<testcase purpose="Check if background-size with '25% 25%' and background-repeat with 'repeat' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-030">
<description>
<pre_condition/>
</spec>
</specs>
</testcase>
- <testcase purpose="Check if background-size with '20% 30%' and background-repeat with 'no-repeat round' display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="Background-size-031">
- <description>
- <pre_condition/>
- <post_condition/>
- <steps>
- <step order="1">
- <step_desc>Check if background-size with '20% 30%' and background-repeat with 'no-repeat round' display correctly in visual</step_desc>
- <expected>there is 1 column of 3 blue-and-orange squares and if there is no partially displayed square and no red</expected>
- </step>
- </steps>
- <test_script_entry>/opt/tct-backgrounds-css3-tests/backgrounds/csswg/background-size-031.html</test_script_entry>
- </description>
- <specs>
- <spec>
- <spec_assertion element_type="property" element_name="background-size" interface="CSS" specification="CSS Backgrounds and Borders Module Level 3 (Partial)" section="DOM, Forms and Styles" category="Tizen W3C API Specifications"/>
- <spec_url>http://www.w3.org/TR/2012/CR-css3-background-20120724/#the-background-size</spec_url>
- <spec_statement/>
- </spec>
- </specs>
- </testcase>
<testcase purpose="Check if background-size with first-letter pseudo-element display correctly in visual" type="compliance" status="approved" component="WebAPI/DOM, Forms and Styles/CSS Backgrounds and Borders Module Level 3 (Partial)" execution_type="manual" priority="P2" id="background-size-032">
<description>
<pre_condition/>
projects / test / tct / web / api.git / commitdiff