tests/auto/declarative/qsgcanvasitem/data/tst_composite.qml

   1 import QtQuick 2.0
   2 import QtTest 1.0
   3 import "testhelper.js" as Helper
   4 Canvas {
   5    id:canvas; width:100;height:50; renderTarget:Canvas.Image
   6    TestCase {
   7        name: "composite"; when: windowShown
   8        function test_clearRect() {
   9            var ctx = canvas.getContext('2d');
  10            ctx.reset();
  11            ctx.fillStyle = '#f00';
  12            ctx.fillRect(0, 0, 100, 50);
  13            ctx.globalCompositeOperation = 'destination-atop';
  14            ctx.clearRect(0, 0, 100, 50);
  15            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0));
  16       }
  17
  18        function test_clip_data() {
  19            return [ {compsite:"copy"},
  20                     {compsite:"destination-atop"},
  21                     {compsite:"destination-in"},
  22                     {compsite:"destination-out"},
  23                     {compsite:"destination-over"},
  24                     {compsite:"lighter"},
  25                     {compsite:"source-atop"},
  26                     {compsite:"source-in"},
  27                     {compsite:"source-out"},
  28                     {compsite:"source-over"},
  29                     {compsite:"xor"}
  30                    ];
  31        }
  32
  33        function test_clip(data) {
  34            var ctx = canvas.getContext('2d');
  35            ctx.reset();
  36            ctx.fillStyle = '#0f0';
  37            ctx.fillRect(0, 0, 100, 50);
  38            ctx.globalCompositeOperation = data.compsite;
  39            ctx.rect(-20, -20, 10, 10);
  40            ctx.clip();
  41            ctx.fillStyle = '#f00';
  42            ctx.fillRect(0, 0, 50, 50);
  43            verify(Helper.comparePixel(ctx, 25,25, 0,255,0,255));
  44            verify(Helper.comparePixel(ctx, 75,25, 0,255,0,255));
  45        }
  46
  47        function test_globalAlpha() {
  48            var ctx = canvas.getContext('2d');
  49            ctx.reset();
  50            compare(ctx.globalAlpha, 1.0);
  51
  52            ctx.fillStyle = '#0f0';
  53            ctx.fillRect(0, 0, 100, 50);
  54            ctx.globalAlpha = 0.01; // avoid any potential alpha=0 optimisations
  55            ctx.fillStyle = '#f00';
  56            ctx.fillRect(0, 0, 100, 50);
  57            //verify(Helper.comparePixel(ctx, 50,25, 2,253,0,255, 2));
  58
  59            ctx.reset();
  60            ctx.globalAlpha = 0.5;
  61            var a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
  62            ctx.globalAlpha = Infinity;
  63            compare(ctx.globalAlpha, a);
  64            ctx.globalAlpha = -Infinity;
  65            compare(ctx.globalAlpha, a);
  66            ctx.globalAlpha = NaN;
  67            compare(ctx.globalAlpha, a);
  68
  69            ctx.globalAlpha = 0.5;
  70            a = ctx.globalAlpha; // might not be exactly 0.5, if it is rounded/quantised, so remember for future comparisons
  71            ctx.globalAlpha = 1.1;
  72            compare(ctx.globalAlpha, a);
  73            ctx.globalAlpha = -0.1;
  74            compare(ctx.globalAlpha, a);
  75            ctx.globalAlpha = 0;
  76            compare(ctx.globalAlpha, 0);
  77            ctx.globalAlpha = 1;
  78            compare(ctx.globalAlpha, 1);
  79
  80        }
  81
  82        function test_operation() {
  83            var ctx = canvas.getContext('2d');
  84            ctx.reset();
  85            ctx.globalCompositeOperation = 'xor';
  86            ctx.globalCompositeOperation = 'Source-over';
  87            compare(ctx.globalCompositeOperation, 'xor');
  88
  89            ctx.reset();
  90            ctx.globalCompositeOperation = 'xor';
  91            ctx.globalCompositeOperation = 'clear';
  92            compare(ctx.globalCompositeOperation, 'xor');
  93
  94            ctx.reset();
  95            ctx.globalCompositeOperation = 'xor';
  96            ctx.globalCompositeOperation = 'darker';
  97            compare(ctx.globalCompositeOperation, 'xor');
  98
  99            ctx.reset();
 100            compare(ctx.globalCompositeOperation, 'source-over');
 101
 102
 103            ctx.reset();
 104            var modes = ['source-atop', 'source-in', 'source-out', 'source-over',
 105                'destination-atop', 'destination-in', 'destination-out', 'destination-over',
 106                'lighter', 'copy', 'xor'];
 107            for (var i = 0; i < modes.length; ++i)
 108            {
 109                ctx.globalCompositeOperation = modes[i];
 110                compare(ctx.globalCompositeOperation, modes[i]);
 111            }
 112
 113            ctx.reset();
 114            ctx.globalCompositeOperation = 'xor';
 115            ctx.globalCompositeOperation = 'highlight';
 116            compare(ctx.globalCompositeOperation, 'xor');
 117
 118            ctx.reset();
 119            ctx.globalCompositeOperation = 'xor';
 120            ctx.globalCompositeOperation = 'source-over\\0';
 121            compare(ctx.globalCompositeOperation, 'xor');
 122
 123            ctx.reset();
 124            ctx.globalCompositeOperation = 'xor';
 125            ctx.globalCompositeOperation = 'over';
 126            compare(ctx.globalCompositeOperation, 'xor');
 127
 128
 129            ctx.reset();
 130            ctx.globalCompositeOperation = 'xor';
 131            ctx.globalCompositeOperation = 'nonexistent';
 132            compare(ctx.globalCompositeOperation, 'xor');
 133        }
 134
 135        function test_solid() {
 136            skip("FIXME");
 137            var ctx = canvas.getContext('2d');
 138            ctx.reset();
 139            ctx.fillStyle = Qt.rgba(0, 1, 1, 1.0);
 140            ctx.fillRect(0, 0, 100, 50);
 141            ctx.globalCompositeOperation = 'copy';
 142            ctx.fillStyle = Qt.rgba(1, 1, 0, 1.0);
 143            ctx.fillRect(0, 0, 100, 50);
 144            //verify(Helper.comparePixel(ctx, 50,25, 255,255,0, 5));
 145
 146            ctx.reset();
 147            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 148            ctx.fillRect(0, 0, 100, 50);
 149            ctx.globalCompositeOperation = 'destination-atop';
 150            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 151            ctx.fillRect(0, 0, 100, 50);
 152            //verify(Helper.comparePixel(ctx, 50,25, 0,255,255,255, 5));
 153
 154            ctx.reset();
 155            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 156            ctx.fillRect(0, 0, 100, 50);
 157            ctx.globalCompositeOperation = 'destination-in';
 158            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 159            ctx.fillRect(0, 0, 100, 50);
 160            //verify(Helper.comparePixel(ctx, 50,25, 0,255,255,255, 5));
 161
 162            ctx.reset();
 163            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 164            ctx.fillRect(0, 0, 100, 50);
 165            ctx.globalCompositeOperation = 'destination-out';
 166            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 167            ctx.fillRect(0, 0, 100, 50);
 168            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 169
 170
 171            ctx.reset();
 172            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 173            ctx.fillRect(0, 0, 100, 50);
 174            ctx.globalCompositeOperation = 'destination-over';
 175            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 176            ctx.fillRect(0, 0, 100, 50);
 177            //verify(Helper.comparePixel(ctx, 50,25, 0,255,255,255, 5));
 178
 179            ctx.reset();
 180            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 181            ctx.fillRect(0, 0, 100, 50);
 182            ctx.globalCompositeOperation = 'lighter';
 183            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 184            ctx.fillRect(0, 0, 100, 50);
 185            //verify(Helper.comparePixel(ctx, 50,25, 255,255,255,255, 5));
 186
 187
 188            ctx.reset();
 189            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 190            ctx.fillRect(0, 0, 100, 50);
 191            ctx.globalCompositeOperation = 'source-atop';
 192            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 193            ctx.fillRect(0, 0, 100, 50);
 194            //verify(Helper.comparePixel(ctx, 50,25, 255,255,0, 5));
 195
 196
 197            ctx.reset();
 198            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 199            ctx.fillRect(0, 0, 100, 50);
 200            ctx.globalCompositeOperation = 'source-in';
 201            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 202            ctx.fillRect(0, 0, 100, 50);
 203            //verify(Helper.comparePixel(ctx, 50,25, 255,255,0, 5));
 204
 205
 206            ctx.reset();
 207            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 208            ctx.fillRect(0, 0, 100, 50);
 209            ctx.globalCompositeOperation = 'source-out';
 210            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 211            ctx.fillRect(0, 0, 100, 50);
 212           // verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 213
 214
 215            ctx.reset();
 216            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 217            ctx.fillRect(0, 0, 100, 50);
 218            ctx.globalCompositeOperation = 'source-over';
 219            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 220            ctx.fillRect(0, 0, 100, 50);
 221            //verify(Helper.comparePixel(ctx, 50,25, 255,255,0, 5));
 222
 223            ctx.reset();
 224            ctx.fillStyle = 'rgba(0, 255, 255, 1.0)';
 225            ctx.fillRect(0, 0, 100, 50);
 226            ctx.globalCompositeOperation = 'xor';
 227            ctx.fillStyle = 'rgba(255, 255, 0, 1.0)';
 228            ctx.fillRect(0, 0, 100, 50);
 229            //verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 230        }
 231        function test_transparent() {
 232
 233            skip("FIXME");
 234            var ctx = canvas.getContext('2d');
 235            ctx.reset();
 236            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 237            ctx.fillRect(0, 0, 100, 50);
 238            ctx.globalCompositeOperation = 'copy';
 239            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 240            ctx.fillRect(0, 0, 100, 50);
 241            verify(Helper.comparePixel(ctx, 50,25, 0,0,255,191, 5));
 242
 243            ctx.reset();
 244            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 245            ctx.fillRect(0, 0, 100, 50);
 246            ctx.globalCompositeOperation = 'copy';
 247            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 248            ctx.fillRect(0, 0, 100, 50);
 249            verify(Helper.comparePixel(ctx, 50,25, 0,0,255,191, 5));
 250
 251            ctx.reset();
 252            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 253            ctx.fillRect(0, 0, 100, 50);
 254            ctx.globalCompositeOperation = 'destination-in';
 255            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 256            ctx.fillRect(0, 0, 100, 50);
 257            verify(Helper.comparePixel(ctx, 50,25, 0,255,0,95, 5));
 258
 259            ctx.reset();
 260            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 261            ctx.fillRect(0, 0, 100, 50);
 262            ctx.globalCompositeOperation = 'destination-out';
 263            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 264            ctx.fillRect(0, 0, 100, 50);
 265            verify(Helper.comparePixel(ctx, 50,25, 0,255,0,31, 5));
 266
 267            ctx.reset();
 268            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 269            ctx.fillRect(0, 0, 100, 50);
 270            ctx.globalCompositeOperation = 'destination-over';
 271            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 272            ctx.fillRect(0, 0, 100, 50);
 273            verify(Helper.comparePixel(ctx, 50,25, 0,145,109,223, 5));
 274
 275
 276            ctx.reset();
 277            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 278            ctx.fillRect(0, 0, 100, 50);
 279            ctx.globalCompositeOperation = 'lighter';
 280            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 281            ctx.fillRect(0, 0, 100, 50);
 282            verify(Helper.comparePixel(ctx, 50,25, 0,127,191,255, 5));
 283
 284            ctx.reset();
 285            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 286            ctx.fillRect(0, 0, 100, 50);
 287            ctx.globalCompositeOperation = 'source-atop';
 288            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 289            ctx.fillRect(0, 0, 100, 50);
 290            verify(Helper.comparePixel(ctx, 50,25, 0,63,191,127, 5));
 291
 292            ctx.reset();
 293            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 294            ctx.fillRect(0, 0, 100, 50);
 295            ctx.globalCompositeOperation = 'source-in';
 296            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 297            ctx.fillRect(0, 0, 100, 50);
 298            verify(Helper.comparePixel(ctx, 50,25, 0,0,255,95, 5));
 299
 300            ctx.reset();
 301            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 302            ctx.fillRect(0, 0, 100, 50);
 303            ctx.globalCompositeOperation = 'source-out';
 304            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 305            ctx.fillRect(0, 0, 100, 50);
 306            verify(Helper.comparePixel(ctx, 50,25, 0,0,255,95, 5));
 307
 308
 309            ctx.reset();
 310            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 311            ctx.fillRect(0, 0, 100, 50);
 312            ctx.globalCompositeOperation = 'source-over';
 313            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 314            ctx.fillRect(0, 0, 100, 50);
 315            verify(Helper.comparePixel(ctx, 50,25, 0,36,218,223, 5));
 316
 317            ctx.reset();
 318            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 319            ctx.fillRect(0, 0, 100, 50);
 320            ctx.globalCompositeOperation = 'xor';
 321            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 322            ctx.fillRect(0, 0, 100, 50);
 323            verify(Helper.comparePixel(ctx, 50,25, 0,63,191,127, 5));
 324
 325        }
 326
 327        function test_uncovered() {
 328            skip("FIXME");
 329            var ctx = canvas.getContext('2d');
 330            ctx.reset();
 331            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 332            ctx.fillRect(0, 0, 100, 50);
 333            ctx.globalCompositeOperation = 'copy';
 334            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 335            ctx.translate(0, 25);
 336            ctx.fillRect(0, 50, 100, 50);
 337            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 338
 339            ctx.reset();
 340            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 341            ctx.fillRect(0, 0, 100, 50);
 342            ctx.globalCompositeOperation = 'destination-atop';
 343            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 344            ctx.translate(0, 25);
 345            ctx.fillRect(0, 50, 100, 50);
 346            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 347
 348
 349
 350            ctx.reset();
 351            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 352            ctx.fillRect(0, 0, 100, 50);
 353            ctx.globalCompositeOperation = 'destination-in';
 354            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 355            ctx.translate(0, 25);
 356            ctx.fillRect(0, 50, 100, 50);
 357            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 358
 359            ctx.reset();
 360            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 361            ctx.fillRect(0, 0, 100, 50);
 362            ctx.globalCompositeOperation = 'source-in';
 363            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 364            ctx.translate(0, 25);
 365            ctx.fillRect(0, 50, 100, 50);
 366            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 367
 368            ctx.reset();
 369            ctx.fillStyle = 'rgba(0, 255, 0, 0.5)';
 370            ctx.fillRect(0, 0, 100, 50);
 371            ctx.globalCompositeOperation = 'source-out';
 372            ctx.fillStyle = 'rgba(0, 0, 255, 0.75)';
 373            ctx.translate(0, 25);
 374            ctx.fillRect(0, 50, 100, 50);
 375            verify(Helper.comparePixel(ctx, 50,25, 0,0,0,0, 5));
 376
 377        }
 378
 379    }
 380 }