Consider the GlyphWidth when calculate the postion of matched word in…

… URL detecting (#8124)

Fix #8121
![image](https://user-images.githubusercontent.com/1068203/97811235-2081ca80-1cb4-11eb-82bd-1ddaf15c757c.png)


<!-- Enter a brief description/summary of your PR here. What does it fix/what does it change/how was it tested (even manually, if necessary)? -->
## Summary of the Pull Request

When calculating the position of the matched pattern, consider the width of the characters.

However, if there are some wide glyphs in the detected hyperlink(not possible for now, for the existing regex will not match wide-character?). The repeated character in the tooltip is not fixed by this PR.

<!-- Other than the issue solved, is this relevant to any other issues/existing PRs? --> 
## References

<!-- Please review the items on the PR checklist before submitting-->
## PR Checklist
* [ ] Closes #8121
* [x] CLA signed. If not, go over [here](https://cla.opensource.microsoft.com/microsoft/Terminal) and sign the CLA
* [ ] Tests added/passed
* [ ] Documentation updated. If checked, please file a pull request on [our docs repo](https://github.com/MicrosoftDocs/terminal) and link it here: #xxx
* [ ] Schema updated.
* [ ] I've discussed this with core contributors already. If not checked, I'm ready to accept this work might be rejected in favor of a different grand plan. Issue number where discussion took place: #xxx

<!-- Provide a more detailed description of the PR, other things fixed or any additional comments/features here -->
## Detailed Description of the Pull Request / Additional comments

When calculating the coordinate of the match in #7691, it simply uses the `prefix.size()` as the total prefix width on the screen.

This PR fixes that behavior.

<!-- Describe how you validated the behavior. Add automated tests wherever possible, but list manual validation steps taken as well -->
## Validation Steps Performed
Manually Verified

src/buffer/out/textBuffer.cpp

@@ -8,6 +8,7 @@
 
 #include "../types/inc/utils.hpp"
 #include "../types/inc/convert.hpp"
+#include "../../types/inc/GlyphWidth.hpp"
 
 #pragma hdrstop
 
@@ -2428,9 +2429,19 @@ PointTree TextBuffer::GetPatterns(const size_t firstRow, const size_t lastRow) c
             // when we find a match, the prefix is text that is between this
             // match and the previous match, so we use the size of the prefix
             // along with the size of the match to determine the locations
-            const auto prefixSize = i->prefix().str().size();
+            size_t prefixSize = 0;
+
+            for (const auto ch : i->prefix().str())
+            {
+                prefixSize += IsGlyphFullWidth(ch) ? 2 : 1;
+            }
             const auto start = lenUpToThis + prefixSize;
-            const auto end = start + i->str().size();
+            size_t matchSize = 0;
+            for (const auto ch : i->str())
+            {
+                matchSize += IsGlyphFullWidth(ch) ? 2 : 1;
+            }
+            const auto end = start + matchSize;
             lenUpToThis = end;
 
             const til::point startCoord{ gsl::narrow<SHORT>(start % rowSize), gsl::narrow<SHORT>(start / rowSize) };