(core) Use visibleCol instead of displayCol with createFormatter

Summary:
Some things (like rendering cells) use the `visibleCol` for `createFormatter`, while other things (like `CopySelection`) used the `displayCol`. For references, the display column has type Any and doesn't know about the original formatting. This resulted in formatting being lost when copying from reference columns even though formatting was preserved when copying from the original (visible) column which looked identical. This diff fixes this and ensures that `createFormatter` is always used with the `visibleCol`. This was agreed on in https://grist.slack.com/archives/C0234CPPXPA/p1639571321043000

Additionally:

- Replaces the functions `createVisibleColFormatter` computed properties `visibleColFormatter` as suggested by a `TODO`.
- Extracts common code from `createVisibleColFormatter` in `ColumnRec` and `ViewFieldRec`

Test Plan: Fixed a test in CopyPaste which displayed the previous inconsistent behaviour.

Reviewers: jarek

Reviewed By: jarek

Differential Revision: https://phab.getgrist.com/D3189

app/client/components/ChartView.ts

@@ -164,7 +164,7 @@ export class ChartView extends Disposable {
     // within a donut chart.
     this._formatterComp = this.autoDispose(ko.computed(() => {
       const field = this.viewSection.viewFields().at(1);
-      return field?.createVisibleColFormatter();
+      return field?.visibleColFormatter();
     }));
 
     this._update = debounce(() => this._updateView(), 0);

app/client/components/CopySelection.ts

@@ -1,8 +1,7 @@
+import type {ViewFieldRec} from 'app/client/models/entities/ViewFieldRec';
 import type {CellValue} from 'app/common/DocActions';
 import type {TableData} from 'app/common/TableData';
 import type {UIRowId} from 'app/common/UIRowId';
-import {createFormatter} from 'app/common/ValueFormatter';
-import type {ViewFieldRec} from 'app/client/models/entities/ViewFieldRec';
 
 /**
  * The CopySelection class is an abstraction for a subset of currently selected cells.
@@ -34,11 +33,7 @@ export class CopySelection {
     this.rowStyle = options.rowStyle;
     this.colStyle = options.colStyle;
     this.columns = fields.map((f, i) => {
-      const formatter = createFormatter(
-        f.displayColModel().type(),
-        f.widgetOptionsJson(),
-        f.documentSettings()
-      );
+      const formatter = f.visibleColFormatter();
       const _fmtGetter = tableData.getRowPropFunc(this.displayColIds[i])!;
       const _rawGetter = tableData.getRowPropFunc(this.colIds[i])!;