search

microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
160.75k stars 28.17k forks source link

Broken SVG in VSCode's WebView #185001

Closed Myriad-Dreamin closed 9 months ago

Myriad-Dreamin commented 1 year ago

Does this issue occur when all extensions are disabled?: Unsure

Steps to Reproduce:

  1. Open SVG in WebView.
  2. Hover content.

The bug is not deeply related to the hover action, but is easy to be triggered by hover effect. The bug is possibly caused by filling CSS color in a Path2D objects in SVG.

<svg viewBox="0 0 150.000 150.000" width="150.000" height="150.000" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:h5="http://www.w3.org/1999/xhtml"><defs><g><symbol overflow="visible" id="g/jbM8KkqPuMAQ" class="outline_glyph"><path d="M 1357 238 L 1305 1094 L 1300 1094 L 840 10 Q 828 -17 801 -16 Q 770 -16 760 10 L 357 1020 L 349 1020 L 295 252 Q 287 156 311.5 115 Q 336 74 430 66 Q 438 58 438 31 Q 438 4 430 -4 Q 307 0 197 0 Q 144 0 20 -4 Q 12 4 12 30.5 Q 12 57 20 66 Q 104 73 134 112 Q 164 151 174 248 L 256 1092 Q 266 1205 245.5 1227 Q 225 1249 117 1255 Q 107 1265 106.5 1290 Q 106 1315 117 1325 L 537 1321 L 903 412 L 913 412 L 1303 1321 L 1714 1325 Q 1724 1315 1724 1290.5 Q 1724 1266 1714 1255 Q 1613 1249 1590 1222.5 Q 1567 1196 1573 1110 L 1635 248 Q 1638 200 1640 175.5 Q 1642 151 1650 127 Q 1658 103 1665 95 Q 1672 87 1692.5 78.5 Q 1713 70 1732.5 68.5 Q 1752 67 1792 66 Q 1802 58 1802 31 Q 1802 4 1792 -4 Q 1657 0 1569 0 Q 1419 0 1227 -4 Q 1217 4 1217 30.5 Q 1217 57 1227 66 Q 1268 68 1284 68.5 Q 1300 69 1321 76.5 Q 1342 84 1346.5 91.5 Q 1351 99 1356.5 121 Q 1362 143 1361 167 Q 1360 191 1357 238 Z "/></symbol><symbol overflow="visible" id="g1Ka9z7tb1k8AQ" class="outline_glyph"><path d="M 666 815 Q 656 823 655.5 847.5 Q 655 872 666 883 Q 768 879 854 879 Q 915 879 997 883 Q 1007 873 1007.5 848 Q 1008 823 997 815 Q 919 808 887.5 776 Q 856 744 822 664 L 549 23 Q 529 -24 500 -25 Q 465 -25 449 18 L 187 666 Q 153 752 126 779 Q 99 806 23 815 Q 13 823 12.5 847.5 Q 12 872 23 883 Q 146 879 213 879 Q 285 879 420 883 Q 430 873 430 848 Q 430 823 420 815 Q 343 805 333.5 778 Q 324 751 356 678 L 504 283 Q 529 220 542 217.5 Q 555 215 580 276 L 745 678 Q 778 756 763 782.5 Q 748 809 666 815 Z "/></symbol><symbol overflow="visible" id="g2q0oc+7j30MAQ" class="outline_glyph"><path d="M 605 99 L 592 98 Q 537 55 462 17.5 Q 387 -20 346 -20 Q 90 -20 90 195 Q 90 306 178 365 Q 266 424 457 483 L 594 526 Q 594 704 553 763.5 Q 512 823 436 823 Q 356 823 350 777 Q 347 757 353 723 Q 359 689 359 680 Q 359 642 322 613.5 Q 285 585 232 585 Q 126 585 126 689 Q 126 752 190.5 804.5 Q 255 857 341 883 Q 427 909 506 909 Q 856 909 856 555 L 852 260 Q 852 184 864.5 153.5 Q 877 123 909 123 Q 958 123 995 152 Q 1026 129 1032 94 Q 911 -21 764 -20 Q 625 -21 605 99 Z M 594 446 L 487 412 Q 436 396 403.5 375 Q 371 354 357.5 327.5 Q 344 301 340 280.5 Q 336 260 336 225 Q 336 172 364.5 137 Q 393 102 455 102 Q 502 102 594 176 L 594 446 Z "/></symbol><symbol overflow="visible" id="g429Et1O8GFwAQ" class="outline_glyph"><path d="M 653 571 Q 653 698 602 767 Q 551 836 455 836 Q 291 836 291 618 Q 291 561 297 519 Q 303 477 321.5 433 Q 340 389 380 365.5 Q 420 342 481 342 Q 653 342 653 571 Z M 270 -20 Q 207 -96 207 -213 Q 207 -305 293 -358.5 Q 379 -412 453 -412 Q 549 -412 639 -387 Q 729 -362 791.5 -309 Q 854 -256 854 -186 Q 854 -147 831.5 -120.5 Q 809 -94 750 -59 Q 687 -24 502 -25 Q 492 -25 440.5 -28 Q 389 -31 352 -31 Q 307 -30 270 -20 Z M 909 793 Q 870 793 852 829 Q 836 854 811 854 Q 793 854 767 837.5 Q 741 821 729 805 Q 817 715 817 592 Q 817 449 715.5 364 Q 614 279 471 279 Q 358 279 285 322 Q 248 271 248 203 Q 248 144 287 115 Q 326 86 379 86 L 440 90 Q 522 100 578 100 Q 795 100 877 33 Q 967 -41 967 -133 Q 967 -239 880 -322.5 Q 793 -406 662.5 -446.5 Q 532 -487 391 -487 Q 254 -487 160 -432 Q 66 -377 66 -254 Q 66 -107 233 -6 Q 139 41 139 152 Q 139 207 163.5 265.5 Q 188 324 229 358 Q 123 460 123 588 Q 123 725 227.5 812 Q 332 899 473 899 Q 600 899 686 842 Q 723 891 784.5 918.5 Q 846 946 891 946 Q 932 946 958.5 924.5 Q 985 903 985 870 Q 985 839 961.5 816 Q 938 793 909 793 Z "/></symbol><symbol overflow="visible" id="g9fnl2cQGl9oAQ" class="outline_glyph"><path d="M 129 889 L 186 889 Q 186 1096 209 1126 Q 215 1134 233.5 1142 Q 252 1150 279 1158.5 Q 306 1167 317 1172 Q 341 1182 385.5 1195 Q 430 1208 441 1208 Q 457 1208 457 1190 Q 451 1094 446 958 L 444 889 L 684 889 Q 700 889 700 877 L 700 813 Q 700 786 651 786 L 444 786 Q 444 671 445 485 Q 446 299 446 260 Q 446 188 472 155.5 Q 498 123 537 123 Q 617 123 653 152 Q 690 121 690 94 Q 657 49 575.5 14.5 Q 494 -20 412 -20 Q 310 -20 242 37 Q 181 90 180 215 Q 180 518 186 786 L 53 786 Q 43 786 43 799 L 43 858 Q 78 889 129 889 Z "/></symbol><symbol overflow="visible" id="gDYWIBcI/Ev8AQ" class="outline_glyph"><path d="M 600 477 L 438 434 Q 243 385 244 209 Q 244 154 281.5 108.5 Q 319 63 391 63 Q 461 63 571 154 Q 600 177 600 207 L 600 477 Z M 600 98 L 596 98 L 555 66 Q 444 -20 332 -20 Q 74 -20 74 201 Q 74 303 167 381 Q 260 459 412 498 L 588 541 Q 600 545 600 565 Q 600 831 434 831 Q 366 831 318 809.5 Q 270 788 270 745 Q 270 716 274 705 Q 280 693 281 668 Q 281 645 253 621.5 Q 225 598 184 598 Q 112 598 113 672 Q 113 758 218.5 828.5 Q 324 899 451 899 Q 760 899 760 553 L 760 252 Q 760 209 761 184.5 Q 762 160 768 131 Q 774 102 787.5 90 Q 801 78 821 78 Q 858 78 897 111 Q 926 95 932 55 Q 854 -21 737 -20 Q 667 -20 638.5 10.5 Q 610 41 600 98 Z "/></symbol><symbol overflow="visible" id="gF5KQAN9n1DAAQ" class="outline_glyph"><path d="M 731 -20 Q 416 -20 246 166 Q 76 352 76 635 Q 76 795 133 937 Q 190 1079 293 1174 Q 483 1348 733 1348 Q 880 1348 1020.5 1302.5 Q 1161 1257 1182 1255 Q 1213 1085 1227 938 Q 1188 918 1159 928 Q 1055 1272 711 1272 Q 532 1272 384 1090 Q 262 940 262 674 Q 262 438 396 250.5 Q 530 63 729 63 Q 872 63 984 115.5 Q 1096 168 1204 287 Q 1235 287 1251 256 Q 1040 -20 731 -20 Z "/></symbol><symbol overflow="visible" id="gOxs0fpquMtAAQ" class="outline_glyph"><path d="M 84 420 Q 84 623 197 756 Q 319 899 518 899 Q 665 899 766.5 826.5 Q 868 754 908 653.5 Q 948 553 948 438 Q 948 224 815 94 Q 698 -21 514 -20 Q 309 -20 196.5 113 Q 84 246 84 420 Z M 487 827 Q 260 827 260 467 Q 260 401 275.5 333.5 Q 291 266 321.5 200.5 Q 352 135 409.5 93 Q 467 51 543 51 Q 633 51 702.5 125 Q 772 199 772 373 Q 772 592 696 709.5 Q 620 827 487 827 Z "/></symbol><symbol overflow="visible" id="gQSKfIc02PMQAQ" class="outline_glyph"><path d="M 1081 262 Q 1081 137 1111 103.5 Q 1141 70 1239 66 Q 1249 58 1249 31 Q 1249 4 1239 -4 Q 1063 0 948 0 Q 870 0 698 -4 Q 688 4 688 30.5 Q 688 57 698 66 Q 766 70 790.5 105.5 Q 815 141 815 262 L 815 604 Q 815 758 662 758 Q 595 758 471 679 L 471 260 Q 471 139 494.5 104.5 Q 518 70 588 66 Q 598 58 598 31 Q 598 4 588 -4 Q 412 0 338 0 Q 219 0 47 -4 Q 37 4 37 30.5 Q 37 57 47 66 Q 145 70 175 103.5 Q 205 137 205 260 L 205 1157 Q 205 1259 184.5 1281 Q 164 1303 66 1311 Q 50 1340 59 1376 Q 313 1386 444 1430 Q 477 1430 477 1403 Q 471 1327 471 1194 L 471 761 Q 706 909 809 909 Q 1081 909 1081 582 L 1081 262 Z "/></symbol><symbol overflow="visible" id="gUuaJugbmwjgAQ" class="outline_glyph"><path d="M 88 879 L 182 879 Q 182 957 181 1008 Q 180 1059 179 1074.5 Q 178 1090 177 1100 Q 176 1110 176 1116 Q 176 1131 221 1144 Q 257 1154 291 1173 Q 325 1191 336 1192 Q 352 1192 352 1174 Q 344 1092 344 958 L 344 879 L 590 879 Q 606 879 606 866 L 606 825 Q 606 798 557 799 L 344 799 L 344 281 Q 344 181 358.5 136.5 Q 373 92 412 92 Q 506 92 580 150 Q 611 148 616 115 Q 495 -20 340 -20 Q 182 -20 182 182 L 182 799 L 61 799 Q 51 799 51 811 L 51 838 Q 51 879 88 879 Z "/></symbol><symbol overflow="visible" id="gXPORtSMOhWoAQ" class="outline_glyph"><path d="M 1139 1049 Q 1139 1121 1132.5 1158.5 Q 1126 1196 1101.5 1217.5 Q 1077 1239 1050.5 1245 Q 1024 1251 961 1257 Q 951 1265 950.5 1290 Q 950 1315 961 1325 Q 1141 1321 1188 1321 Q 1249 1321 1417 1325 Q 1425 1315 1425 1290.5 Q 1425 1266 1417 1257 Q 1302 1245 1270.5 1212.5 Q 1239 1180 1239 1049 L 1239 43 Q 1239 -20 1192 -20 Q 1147 -20 1110 29 L 395 932 Q 344 1000 326 999 Q 310 999 309 899 L 309 272 Q 309 200 315.5 162.5 Q 322 125 346.5 103.5 Q 371 82 397.5 76 Q 424 70 487 63 Q 495 53 495.5 28.5 Q 496 4 487 -4 Q 315 0 260 0 Q 207 0 31 -4 Q 21 4 20.5 28.5 Q 20 53 31 63 Q 146 75 177.5 108 Q 209 141 209 272 L 209 1126 Q 199 1171 154 1212 Q 109 1253 47 1257 Q 37 1265 37 1290 Q 37 1315 47 1325 L 324 1321 L 1026 430 Q 1114 317 1124 317 Q 1138 317 1139 379 L 1139 1049 Z "/></symbol><symbol overflow="visible" id="gZTB4zAgyLHMAQ" class="outline_glyph"><path d="M 184 1227 Q 184 1264 219 1294.5 Q 254 1325 291 1325 Q 330 1325 359.5 1291 Q 389 1257 389 1219 Q 389 1184 356.5 1152 Q 324 1120 283 1120 Q 246 1120 215 1154 Q 184 1188 184 1227 Z M 371 250 Q 371 127 395.5 98.5 Q 420 70 518 63 Q 528 53 528 28.5 Q 528 4 518 -4 Q 383 0 291 0 Q 197 0 61 -4 Q 53 4 53 28.5 Q 53 53 61 63 Q 159 71 184 99 Q 209 127 209 250 L 209 649 Q 209 735 185.5 757.5 Q 162 780 76 788 Q 64 823 72 846 Q 262 871 352 905 Q 379 905 379 891 Q 371 760 371 658 L 371 250 Z "/></symbol><symbol overflow="visible" id="gaFysXBLPTOUAQ" class="outline_glyph"><path d="M 813 357 Q 961 456 1197 456 Q 1200 456 1204 456 Q 1345 454 1385 415 Q 1398 402 1398 394 Q 1398 387 1389.5 382 Q 1381 377 1363.5 375 Q 1346 373 1330 372.5 Q 1314 372 1289 372 Q 1283 372 1272.5 372 Q 1262 372 1257 372 Q 1254 372 1251 372 Q 1071 372 942.5 342 Q 814 312 722 243 Q 704 230 704 231 Q 702 232 712 249.5 Q 722 267 730 278 Q 761 322 813 357 Z M 1371 709 Q 1389 709 1402.5 715 Q 1416 721 1425.5 734.5 Q 1435 748 1440 758.5 Q 1445 769 1452 789 L 1452 844 Q 1452 900 1449 911 Q 1439 939 1419 958.5 Q 1399 978 1372 978 Q 1362 978 1352 975 Q 1316 965 1297 925 Q 1289 909 1287 896 Q 1285 883 1285 844 Q 1285 797 1290 782 Q 1313 709 1371 709 Z M 1348 1028 Q 1359 1031 1370 1031 Q 1406 1031 1436 1006 Q 1466 981 1482 946 Q 1504 900 1504 845 Q 1504 792 1484.5 746.5 Q 1465 701 1430 677 Q 1402 658 1371 658 Q 1330 658 1295.5 690.5 Q 1261 723 1246 779 Q 1238 811 1238 844 Q 1238 910 1269 963 Q 1300 1016 1348 1028 Z M 755 911 Q 746 939 726 958 Q 706 977 678 977 Q 677 977 675 977 Q 658 977 642 968 Q 626 959 614 943 Q 602 927 596 906 Q 592 894 592 870 Q 592 861 592 840 Q 593 795 595.5 783 Q 598 771 611 750 Q 617 739 626.5 729.5 Q 636 720 649.5 713.5 Q 663 707 677 707 Q 691 707 705 714 Q 736 730 758 784 L 758 841 Q 759 864 759 874 Q 759 900 755 911 Z M 654 1028 Q 666 1031 677 1031 Q 708 1031 736.5 1011 Q 765 991 784 956 Q 810 906 810 845 Q 810 781 782 729.5 Q 754 678 707 662 Q 677 652 646 663 Q 603 678 575.5 723.5 Q 548 769 544 830 Q 544 837 544 844 Q 544 912 575.5 964.5 Q 607 1017 654 1028 Z M 1428 1592 Q 1238 1685 1026 1685 Q 971 1685 914 1678 Q 763 1660 626.5 1594.5 Q 490 1529 386 1429.5 Q 282 1330 211 1198.5 Q 140 1067 113 919 L 107 886 L 106 776 Q 106 728 106 709 Q 106 654 114 608 Q 154 370 301 190 Q 448 10 659 -80 Q 833 -154 1023 -154 Q 1203 -154 1369 -88 Q 1484 -43 1584 32.5 Q 1684 108 1754 201 Q 1814 277 1842 330 Q 1902 444 1931 602 Q 1939 645 1942 657 Q 1946 675 1946 777 Q 1946 849 1943 874 Q 1922 1045 1836 1201 Q 1690 1464 1428 1592 Z M 883 1714 Q 954 1724 1024 1724 Q 1183 1724 1324.5 1676 Q 1466 1628 1579 1548 Q 1758 1421 1863.5 1231.5 Q 1969 1042 1983 824 Q 1985 794 1985 764 Q 1985 598 1927.5 441 Q 1870 284 1769 158 Q 1668 32 1522 -57.5 Q 1376 -147 1206 -179 Q 1116 -196 1024 -196 Q 822 -196 640 -116 Q 453 -34 315.5 116 Q 178 266 113 459 Q 63 607 63 764 Q 63 937 124.5 1100.5 Q 186 1264 302 1397 Q 415 1525 565 1607 Q 715 1689 883 1714 Z "/></symbol><symbol overflow="visible" id="gfPvNCHVpvNsAQ" class="outline_glyph"><path d="M 377 733 Q 522 899 713 899 Q 830 899 883 829 Q 938 755 938 555 L 938 250 Q 938 129 961.5 100.5 Q 985 72 1075 63 Q 1083 53 1083 28.5 Q 1083 4 1075 -4 Q 952 0 858 0 Q 772 0 649 -4 Q 641 6 641 30.5 Q 641 55 649 63 Q 733 71 754.5 100 Q 776 129 776 250 L 776 561 Q 776 670 752 719 Q 713 793 643 793 Q 518 793 393 672 Q 358 633 358 586 L 358 250 Q 358 129 379.5 100.5 Q 401 72 483 63 Q 491 53 491.5 28.5 Q 492 4 483 -4 Q 360 0 279 0 Q 177 0 53 -4 Q 45 4 45 28.5 Q 45 53 53 63 Q 149 71 173 99 Q 197 127 197 250 L 197 649 Q 197 735 173.5 757.5 Q 150 780 63 788 Q 51 823 59 846 Q 211 866 311 905 Q 327 905 336 889 Q 348 864 352 733 Q 352 706 377 733 Z "/></symbol><symbol overflow="visible" id="goo+qLHkBj1AAQ" class="outline_glyph"><path d="M 707 254 L 707 643 Q 707 690 700.5 709.5 Q 694 729 672 754 Q 609 828 506 827 Q 383 827 315 725 Q 256 641 256 453 Q 256 273 323.5 174.5 Q 391 76 481 76 Q 561 76 674 174 Q 707 203 707 254 Z M 684 103 Q 534 -20 428 -20 Q 266 -20 173 100.5 Q 80 221 80 416 Q 80 635 221 776 Q 350 899 528 899 Q 559 899 596 890 Q 633 881 659.5 872.5 Q 686 864 688 864 Q 706 864 707 883 L 707 1145 Q 707 1211 703.5 1243.5 Q 700 1276 677.5 1291.5 Q 655 1307 643 1308 Q 631 1309 575 1313 Q 552 1336 563 1374 Q 745 1388 850 1430 Q 877 1430 877 1409 Q 869 1327 868 1194 L 868 266 Q 868 186 896 155.5 Q 924 125 1018 117 Q 1028 107 1028 88.5 Q 1028 70 1018 61 Q 854 43 776 -20 Q 758 -28 737 -20 Q 719 52 715 100 Q 713 110 702.5 110 Q 692 110 684 103 Z "/></symbol><symbol overflow="visible" id="guVoAaeU4H7kAQ" class="outline_glyph"><path d="M 254 578 L 625 584 Q 656 584 655 612 Q 655 729 605 778 Q 555 827 485 827 Q 458 827 432 820 Q 406 813 368 790.5 Q 330 768 299 713 Q 268 658 254 578 Z M 791 190 Q 826 188 834 158 Q 697 -20 485 -20 Q 282 -20 172 111 Q 76 222 76 414 Q 76 631 206 763 Q 336 895 485 895 Q 831 895 831 539 Q 831 504 793 504 L 248 508 Q 248 336 313 227 Q 403 80 537 80 Q 623 80 677.5 104.5 Q 732 129 791 190 Z "/></symbol><symbol overflow="visible" id="gx+hvjmxMCBkAQ" class="outline_glyph"><path d="M 808 1292 Q 836 1151 845 1028 Q 820 1009 778 1016 Q 760 1074 740.5 1115 Q 721 1156 687 1196.5 Q 653 1237 599.5 1257.5 Q 546 1278 475 1278 Q 386 1278 318.5 1207 Q 251 1136 251 1049 Q 251 1000 275 956 Q 299 912 329 884 Q 359 856 411 827 Q 463 798 494 785.5 Q 525 773 577 753 Q 648 726 701 697 Q 754 668 805 624 Q 856 580 882.5 517.5 Q 909 455 909 377 Q 909 280 857 191 Q 805 102 717 47 Q 609 -20 464 -20 Q 367 -20 260.5 3.5 Q 154 27 96 27 Q 65 156 55 338 Q 87 355 122 344 Q 186 53 481 53 Q 604 53 670.5 117.5 Q 737 182 737 305 Q 737 363 719 410 Q 701 457 678 485.5 Q 655 514 611 540.5 Q 567 567 540 579 Q 513 591 462 610 Q 385 639 328.5 669.5 Q 272 700 217 745.5 Q 162 791 133 853.5 Q 104 916 104 993 Q 104 1151 218.5 1249.5 Q 333 1348 494 1348 Q 611 1348 695.5 1322 Q 780 1296 808 1292 Z "/></symbol></g></defs>
<style type="text/css">.typst-txt {
  pointer-events: bounding-box;
}
.tsel {
  position: fixed;
  text-align: justify;
  white-space: nowrap;
  width: 100%;
  height: 100%;
  text-align-last: justify;
  color: transparent;
}
.tsel::-moz-selection {
  color: transpaent;
  background: #7db9dea0;
}
.tsel::selection {
  color: transpaent;
  background: #7db9dea0;
}
svg {
  --glyph_fill: black;
}
.pseudo-link {
  fill: transparent;
  cursor: pointer;
  pointer-events: all;
}
.outline_glyph {
  fill: var(--glyph_fill);
}
.outline_glyph {
  transition: 0.2s all;
}
.hover .typst-txt {
  --glyph_fill: #66bab7;
}

.typst-txt:hover {
  --glyph_fill: #f75c2f;
}
</style><style type="text/css">g.f004225 { --glyph_fill: #004225; } g.fff851b { --glyph_fill: #ff851b; } </style><g transform="translate(0, 0)" data-tid="p8tq9/PkR5zQAQ"><g class="group" data-tid="p8tq9/PkR5zQAQ"><g transform="translate(36.000,43.740)" ><g class="typst-txt f004225" data-tid="pUb5iq0CKkE4AQ"><g transform="scale(0.005859375,-0.005859375)"><g transform="translate(0,0)"><use href="#g/jbM8KkqPuMAQ"/></g><g transform="translate(1841,0)"><use href="#g2q0oc+7j30MAQ"/></g><g transform="translate(2877,0)"><use href="#g9fnl2cQGl9oAQ"/></g><g transform="translate(3610,0)"><use href="#gQSKfIc02PMQAQ"/></g></g>
              <foreignObject x="0" y="-10.728516" width="28.576172" height="12">
                <h5:div class="tsel" style="font-size: 12px;">Math</h5:div>
                </foreignObject>
            </g></g><g transform="translate(36.000,66.138)" ><g class="typst-txt tb" data-tid="p1xtT24b4DxEAQ"><g transform="scale(0.0048828125,-0.0048828125)"><g transform="translate(0,0)"><use href="#gx+hvjmxMCBkAQ"/></g><g transform="translate(993,0)"><use href="#g1Ka9z7tb1k8AQ"/></g><g transform="translate(2010,0)"><use href="#g429Et1O8GFwAQ"/></g><g transform="translate(3546,0)"><use href="#gF5KQAN9n1DAAQ"/></g><g transform="translate(4869,0)"><use href="#gOxs0fpquMtAAQ"/></g><g transform="translate(5901,0)"><use href="#gfPvNCHVpvNsAQ"/></g><g transform="translate(7011,0)"><use href="#gUuaJugbmwjgAQ"/></g><g transform="translate(7658,0)"><use href="#guVoAaeU4H7kAQ"/></g><g transform="translate(8573,0)"><use href="#gfPvNCHVpvNsAQ"/></g><g transform="translate(9683,0)"><use href="#gUuaJugbmwjgAQ"/></g></g>
              <foreignObject x="0" y="-8.94043" width="52.939453" height="10">
                <h5:div class="tsel" style="font-size: 10px;">Svg Content </h5:div>
                </foreignObject>
            </g></g><g transform="translate(88.939,66.138)" ><g class="typst-txt fff851b" data-tid="pfNwquJIHpikAQ"><g transform="scale(0.0048828125,-0.0048828125)"><g transform="translate(0,0)"><use href="#gXPORtSMOhWoAQ"/></g><g transform="translate(1431,0)"><use href="#gOxs0fpquMtAAQ"/></g><g transform="translate(2975,0)"><use href="#gZTB4zAgyLHMAQ"/></g><g transform="translate(3530,0)"><use href="#goo+qLHkBj1AAQ"/></g><g transform="translate(4566,0)"><use href="#guVoAaeU4H7kAQ"/></g><g transform="translate(5481,0)"><use href="#gDYWIBcI/Ev8AQ"/></g></g>
              <foreignObject x="0" y="-8.94043" width="33.828125" height="10">
                <h5:div class="tsel" style="font-size: 10px;">No idea </h5:div>
                </foreignObject>
            </g></g><g transform="translate(122.768,66.138)" ><g class="typst-txt fff851b" data-tid="pL8W6M129f2UAQ"><g transform="scale(0.0048828125,-0.0048828125)"><g transform="translate(0,0)"><use href="#gaFysXBLPTOUAQ"/></g></g>
              <foreignObject x="0" y="-7.998047" width="10" height="10">
                <h5:div class="tsel" style="font-size: 10px;">😕</h5:div>
                </foreignObject>
            </g></g></g></g>
</svg>

https://github.com/microsoft/vscode/assets/35292584/16c00af6-3307-4d9e-be7b-12bde0fe4f82

mjbvz commented 12 months ago

Does this work in Chrome on a normal webpage?

Myriad-Dreamin commented 12 months ago

Does this work in Chrome on a normal webpage?

They work in chrome and firefox. I realized that the following rules do not work well with webview managed by vscode:

.outline_glyph {
  fill: var(--glyph_fill);
}
.outline_glyph {
  transition: 0.2s all; // The webview corrupts when it is trying to transist the fill color.
}
VSCodeTriageBot commented 9 months ago

Hey @mjbvz, this issue might need further attention.

@Myriad-Dreamin, you can help us out by closing this issue if the problem no longer exists, or adding more information.

VSCodeTriageBot commented 9 months ago

This issue has been closed automatically because it needs more information and has not had recent activity. See also our issue reporting guidelines.

Happy Coding!