GetBoundingClientRect () returns the wrong width

Question

I use Angular Materialfor my grid. I am trying to create an SVG, and it should show me the width of the element, however it getBoundingClientRect()returns 300px, despite the width 618px. I tried again to make my window smaller, but it still seemed 300px, although this time it was actually 100px..

This is my HTML:

<div layout="row" layout-wrap layout-padding>
    <div flex="33" ng-repeat="result in ctrl.results">
        <svg height="100%" width="100%" position>
          <rect x="0" y="0" width="100%" height="100%" fill="#da552f"></rect>
          <text fill="#ffffff" x="50%" y="50%" alignment-baseline="middle" text-anchor="middle" font-size="48" font-family="Verdana">Hello World</text>
        </svg>
    </div>
</div>

and this is my angularjs directive for the attribute position:

var app = angular.module('MainDirective', []);

app.directive('position', function () {
    return {
        restrict: 'A',
        link: function ($scope, element, attrs) {
            var rect = element[0].getBoundingClientRect();
            var text = element.children()[1].getBBox();
            console.log(rect)
        }
    };
});

There is no special CSS in my project.

Any thoughts why this could happen? I tried so many different options getBoundingClientRect(), but they all returned 300...

Edit: as evidence:

Answer 1

, . $scope.$watch, svg .

var app = angular.module('MainDirective', []);

app.directive('position', function () {
    return {
        restrict: 'A',
        link: function ($scope, element, attrs) {
            var rect, image, text;
            $scope.$watch(element, function () {
                rect = element[0].clientWidth;
                image = element.children()[1].getBBox();
                text = element.children()[2].getBBox();
                console.log("Rect: "+rect+" image: "+image.width+" text: "+text.width)
            });
        }
    };
});

Answer 2

, , : 300 - , "". , :

https://www.w3.org/TR/CSS2/visudet.html#Computing_widths_and_margins