Randomly not recognising ellemets and attributes

[1GR3]

Sometimes I get this errors out of the blue, and sometimes I can't get rid of them:

Error 22 Unknown element 'def'
Error 22 Unknown attribute 'x'
Error 22 Unknown attribute 'y'

In this case, adding transform on <use> broke everything:

<svg class="background">
  <def>
    
    <symbol id="block">
      <rect x="0" y="0" width="30" height="60">
        
      </rect>
    </symbol>
    
    <symbol id="Sw">
      <rect x="-15" y="-15" width="30" height="30"/>
      <use href="#block" x="-15" y="15"></use>
      <g transform="rotate(90)"  x="-15" y="15"><use href="#block"></use></g>
      
    </symbol>
    
  </def>
  <g id="m" transform="translate(50%,50%)">
    <use href="#Sw"></use>
    
  </g>
  <text id="myLabel" />
</svg>

How to get rid of this bug? 

[JonFitbit · Accepted solution]

With these specific erors:

it's <defs> not <def>

https://dev.fitbit.com/build/guides/user-interface/svg/#defs

and `x` and `y` aren't valid attributes on the `<g>` element.

https://dev.fitbit.com/build/guides/user-interface/svg/#g-container

[1GR3]

This is a little bit embarrassing 😬

Thank you!