user-select:none still part of copied Rich Text in Chrome

Question

I'm trying to use this answer to copy and paste hyperlinks from Chrome as plain text and it seems to work when I paste to notepad. However, regardless of user-select: none;, when I paste the same clipboard contents to Libreoffice Writer all text is pasted. This happens when a styled block is surrounded by selectable blocks.

.unselectable {
  position: absolute;
  z-index: 1;
  color: green;
  user-select: none;
  -webkit-user-select: none;
}

.selectable {
  position: absolute;
  z-index: 2;
  color: rgba(0, 0, 0, 0);
  user-select: text;
  -webkit-user-select: text;
}

xxx
<p style="user-select: none;">
  <a href="mailto:unselectable@b.org">unselectable</a>
</p>

<p>
  <a href="mailto:default@b.org">default</a>
</p>

<div>
  <p unselectable="on" class="unselectable">unselectable2</p>
  <p>zzz</p>
</div>

I tried to select from xxx to zzz and all I get here in the stackeditor is `xxx default zzz` — mplungjan, Nov 26 '20 at 12:05
Quite a lot of [dupes](https://www.google.com/search?q=%22user-select%3A+none%22+site%3Astackoverflow.com) — mplungjan, Nov 26 '20 at 12:06
@mplungjan what version of Chrome and what's your Rich Text editor? — basin, Nov 26 '20 at 12:07
This works as expected. Maybe an addon causing this? Try if from Incognito tab — Alon Eitan, Nov 26 '20 at 12:11

mw509 · Answer 1 · 2020-11-26T13:10:31.923

0

Turns out this is a bug in Chrome.

A work around would be using -web-kit

.parent :not(.selectable-all) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.selectable-all {
  -webkit-user-select: all;
  -moz-user-select: all;
  -ms-user-select: all;
  user-select: all;
}

<div class="parent">
  <span>un-selectable</span>
  <div class="child selectable-all">
    Selectable
  </div>
</div>

<div class="child selectable-all">
  Selectable
</div>

I tried and it works fine. Try and let me know if it worked for you as well.

Here is a link for reference;User-select: all inheritance not working in chrome 62

edited Nov 26 '20 at 13:10

answered Nov 26 '20 at 12:13

mw509

1,605
1
18
24

`web-kit` with a hyphen? – basin Nov 26 '20 at 12:16
well yeaaaaaaaaa – mw509 Nov 26 '20 at 12:22
Can you please post the full html? If I surround the divs from that answer with xxx and zzz the workaround doesn't work – basin Nov 26 '20 at 12:27
So you mean this does not work when the zzz and/or xxx comes before the un-selectables? – mw509 Nov 26 '20 at 13:22

user-select:none still part of copied Rich Text in Chrome

1 Answers1