Implement translation for text blocks

[vitonsky]

Currently we translate a DOM nodes, so translator may be called multiple times with something like

• hello
• world
• how
• are
• u

This behaviour leads to bad translation results due to lack of context.

We should improve the API to handle text blocks together so call translation for hello world how are u.

Requirements

• All text nodes in one block element must be passed to a translator
• Each text node must be a unit of translation. So nodes may be translated separately, but in one context
• The text block must be as small as possible. For example an one p element or div or anything. But it must not be a body or any other block element that contains another block elements.

There are still questions to research and answer

• How to handle anything like <div>A <div>quick brown</div> fox <p>jumps over</p> a lazy dog? Here we have a small block containers like <div>quick brown</div> and <p>jumps over</p>, but its have no own context. How to handle it? What a formal rule to handle fine this case and trivial cases with large texts?

[vitonsky]

Ideally we should handle

<article>
  <h1>The quick brown fox</h1>
  
  <p>
    A <span>quick brown</span> fox
    <span>jumps over</span>
    a lazy dog
  </p>
  
  <p>Another paragraph</p>
</article>

as a

[
  "The quick brown fox",
  "A quick brown fox jumps over a lazy dog",
  "Another paragraph"
]