Skip to content

Commit be8033a

Browse files
intergalacticspacehighwayintergalacticspacehighway
committed
add span syntax support and test
1 parent 3ad6a75 commit be8033a

File tree

9 files changed

+788
-62
lines changed

9 files changed

+788
-62
lines changed

‎gentest/fixtures/YGGridTest.html‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -525,3 +525,17 @@
525525
<div></div>
526526
<div></div>
527527
</div>
528+
529+
<div
530+
id="grid_spanning_items_with_span"
531+
style="
532+
display: grid;
533+
grid-template-columns: 100px auto 100px;
534+
grid-template-rows: 100px 200px 100px;
535+
gap: 10px;
536+
">
537+
<div style="grid-column-start: span 2; grid-row-start: span 2"></div>
538+
<div></div>
539+
<div></div>
540+
<div></div>
541+
</div>

‎gentest/gentest-cpp.js‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -591,24 +591,48 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
591591
},
592592
},
593593

594+
YGNodeStyleSetGridColumnStartSpan: {
595+
value: function (nodeName, value) {
596+
this.push(`YGNodeStyleSetGridColumnStartSpan(${nodeName}, ${value});`);
597+
},
598+
},
599+
594600
YGNodeStyleSetGridColumnEnd: {
595601
value: function (nodeName, value) {
596602
this.push(`YGNodeStyleSetGridColumnEnd(${nodeName}, ${value});`);
597603
},
598604
},
599605

606+
YGNodeStyleSetGridColumnEndSpan: {
607+
value: function (nodeName, value) {
608+
this.push(`YGNodeStyleSetGridColumnEndSpan(${nodeName}, ${value});`);
609+
},
610+
},
611+
600612
YGNodeStyleSetGridRowStart: {
601613
value: function (nodeName, value) {
602614
this.push(`YGNodeStyleSetGridRowStart(${nodeName}, ${value});`);
603615
},
604616
},
605617

618+
YGNodeStyleSetGridRowStartSpan: {
619+
value: function (nodeName, value) {
620+
this.push(`YGNodeStyleSetGridRowStartSpan(${nodeName}, ${value});`);
621+
},
622+
},
623+
606624
YGNodeStyleSetGridRowEnd: {
607625
value: function (nodeName, value) {
608626
this.push(`YGNodeStyleSetGridRowEnd(${nodeName}, ${value});`);
609627
},
610628
},
611629

630+
YGNodeStyleSetGridRowEndSpan: {
631+
value: function (nodeName, value) {
632+
this.push(`YGNodeStyleSetGridRowEndSpan(${nodeName}, ${value});`);
633+
},
634+
},
635+
612636
YGNodeStyleSetGridAutoColumns: {
613637
value: function (nodeName, value) {
614638
if (!value) {

‎gentest/gentest-java.js‎

Lines changed: 32 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -537,42 +537,50 @@ JavaEmitter.prototype = Object.create(Emitter.prototype, {
537537
},
538538

539539
YGNodeStyleSetGridColumnStart: {
540-
value: function (nodeName, gridLine) {
541-
if (gridLine.type === 'auto') {
542-
this.push(`${nodeName}.setGridColumnStartAuto();`);
543-
} else if (gridLine.type === 'integer') {
544-
this.push(`${nodeName}.setGridColumnStart(${gridLine.value});`);
545-
}
540+
value: function (nodeName, value) {
541+
this.push(`${nodeName}.setGridColumnStart(${value});`);
542+
},
543+
},
544+
545+
YGNodeStyleSetGridColumnStartSpan: {
546+
value: function (nodeName, value) {
547+
this.push(`${nodeName}.setGridColumnStartSpan(${value});`);
546548
},
547549
},
548550

549551
YGNodeStyleSetGridColumnEnd: {
550-
value: function (nodeName, gridLine) {
551-
if (gridLine.type === 'auto') {
552-
this.push(`${nodeName}.setGridColumnEndAuto();`);
553-
} else if (gridLine.type === 'integer') {
554-
this.push(`${nodeName}.setGridColumnEnd(${gridLine.value});`);
555-
}
552+
value: function (nodeName, value) {
553+
this.push(`${nodeName}.setGridColumnEnd(${value});`);
554+
},
555+
},
556+
557+
YGNodeStyleSetGridColumnEndSpan: {
558+
value: function (nodeName, value) {
559+
this.push(`${nodeName}.setGridColumnEndSpan(${value});`);
556560
},
557561
},
558562

559563
YGNodeStyleSetGridRowStart: {
560-
value: function (nodeName, gridLine) {
561-
if (gridLine.type === 'auto') {
562-
this.push(`${nodeName}.setGridRowStartAuto();`);
563-
} else if (gridLine.type === 'integer') {
564-
this.push(`${nodeName}.setGridRowStart(${gridLine.value});`);
565-
}
564+
value: function (nodeName, value) {
565+
this.push(`${nodeName}.setGridRowStart(${value});`);
566+
},
567+
},
568+
569+
YGNodeStyleSetGridRowStartSpan: {
570+
value: function (nodeName, value) {
571+
this.push(`${nodeName}.setGridRowStartSpan(${value});`);
566572
},
567573
},
568574

569575
YGNodeStyleSetGridRowEnd: {
570-
value: function (nodeName, gridLine) {
571-
if (gridLine.type === 'auto') {
572-
this.push(`${nodeName}.setGridRowEndAuto();`);
573-
} else if (gridLine.type === 'integer') {
574-
this.push(`${nodeName}.setGridRowEnd(${gridLine.value});`);
575-
}
576+
value: function (nodeName, value) {
577+
this.push(`${nodeName}.setGridRowEnd(${value});`);
578+
},
579+
},
580+
581+
YGNodeStyleSetGridRowEndSpan: {
582+
value: function (nodeName, value) {
583+
this.push(`${nodeName}.setGridRowEndSpan(${value});`);
576584
},
577585
},
578586

‎gentest/gentest-javascript.js‎

Lines changed: 32 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -496,42 +496,50 @@ JavascriptEmitter.prototype = Object.create(Emitter.prototype, {
496496
},
497497

498498
YGNodeStyleSetGridColumnStart: {
499-
value: function (nodeName, gridLine) {
500-
if (gridLine.type === 'auto') {
501-
this.push(`${nodeName}.setGridColumnStartAuto();`);
502-
} else if (gridLine.type === 'integer') {
503-
this.push(`${nodeName}.setGridColumnStart(${gridLine.value});`);
504-
}
499+
value: function (nodeName, value) {
500+
this.push(`${nodeName}.setGridColumnStart(${value});`);
501+
},
502+
},
503+
504+
YGNodeStyleSetGridColumnStartSpan: {
505+
value: function (nodeName, value) {
506+
this.push(`${nodeName}.setGridColumnStartSpan(${value});`);
505507
},
506508
},
507509

508510
YGNodeStyleSetGridColumnEnd: {
509-
value: function (nodeName, gridLine) {
510-
if (gridLine.type === 'auto') {
511-
this.push(`${nodeName}.setGridColumnEndAuto();`);
512-
} else if (gridLine.type === 'integer') {
513-
this.push(`${nodeName}.setGridColumnEnd(${gridLine.value});`);
514-
}
511+
value: function (nodeName, value) {
512+
this.push(`${nodeName}.setGridColumnEnd(${value});`);
513+
},
514+
},
515+
516+
YGNodeStyleSetGridColumnEndSpan: {
517+
value: function (nodeName, value) {
518+
this.push(`${nodeName}.setGridColumnEndSpan(${value});`);
515519
},
516520
},
517521

518522
YGNodeStyleSetGridRowStart: {
519-
value: function (nodeName, gridLine) {
520-
if (gridLine.type === 'auto') {
521-
this.push(`${nodeName}.setGridRowStartAuto();`);
522-
} else if (gridLine.type === 'integer') {
523-
this.push(`${nodeName}.setGridRowStart(${gridLine.value});`);
524-
}
523+
value: function (nodeName, value) {
524+
this.push(`${nodeName}.setGridRowStart(${value});`);
525+
},
526+
},
527+
528+
YGNodeStyleSetGridRowStartSpan: {
529+
value: function (nodeName, value) {
530+
this.push(`${nodeName}.setGridRowStartSpan(${value});`);
525531
},
526532
},
527533

528534
YGNodeStyleSetGridRowEnd: {
529-
value: function (nodeName, gridLine) {
530-
if (gridLine.type === 'auto') {
531-
this.push(`${nodeName}.setGridRowEndAuto();`);
532-
} else if (gridLine.type === 'integer') {
533-
this.push(`${nodeName}.setGridRowEnd(${gridLine.value});`);
534-
}
535+
value: function (nodeName, value) {
536+
this.push(`${nodeName}.setGridRowEnd(${value});`);
537+
},
538+
},
539+
540+
YGNodeStyleSetGridRowEndSpan: {
541+
value: function (nodeName, value) {
542+
this.push(`${nodeName}.setGridRowEndSpan(${value});`);
535543
},
536544
},
537545

‎gentest/gentest.js‎

Lines changed: 42 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -541,28 +541,60 @@ function setupTestTree(
541541
break;
542542
case 'grid-column-start':
543543
if (node.style[style] && node.style[style] !== 'auto') {
544-
e.YGNodeStyleSetGridColumnStart(
545-
nodeName,
546-
parseInt(node.style[style]),
547-
);
544+
const value = node.style[style];
545+
if (value.startsWith('span ')) {
546+
e.YGNodeStyleSetGridColumnStartSpan(
547+
nodeName,
548+
parseInt(value.substring(5)),
549+
);
550+
} else {
551+
e.YGNodeStyleSetGridColumnStart(
552+
nodeName,
553+
parseInt(value),
554+
);
555+
}
548556
}
549557
break;
550558
case 'grid-column-end':
551559
if (node.style[style] && node.style[style] !== 'auto') {
552-
e.YGNodeStyleSetGridColumnEnd(
553-
nodeName,
554-
parseInt(node.style[style]),
555-
);
560+
const value = node.style[style];
561+
if (value.startsWith('span ')) {
562+
e.YGNodeStyleSetGridColumnEndSpan(
563+
nodeName,
564+
parseInt(value.substring(5)),
565+
);
566+
} else {
567+
e.YGNodeStyleSetGridColumnEnd(
568+
nodeName,
569+
parseInt(value),
570+
);
571+
}
556572
}
557573
break;
558574
case 'grid-row-start':
559575
if (node.style[style] && node.style[style] !== 'auto') {
560-
e.YGNodeStyleSetGridRowStart(nodeName, parseInt(node.style[style]));
576+
const value = node.style[style];
577+
if (value.startsWith('span ')) {
578+
e.YGNodeStyleSetGridRowStartSpan(
579+
nodeName,
580+
parseInt(value.substring(5)),
581+
);
582+
} else {
583+
e.YGNodeStyleSetGridRowStart(nodeName, parseInt(value));
584+
}
561585
}
562586
break;
563587
case 'grid-row-end':
564588
if (node.style[style] && node.style[style] !== 'auto') {
565-
e.YGNodeStyleSetGridRowEnd(nodeName, parseInt(node.style[style]));
589+
const value = node.style[style];
590+
if (value.startsWith('span ')) {
591+
e.YGNodeStyleSetGridRowEndSpan(
592+
nodeName,
593+
parseInt(value.substring(5)),
594+
);
595+
} else {
596+
e.YGNodeStyleSetGridRowEnd(nodeName, parseInt(value));
597+
}
566598
}
567599
break;
568600
case 'grid-auto-columns':

0 commit comments

Comments
 (0)