Customized border for google document table with Google Apps Script

Question

I'm very new to Google's app script. I have read the documentation and I can already do some things, but I have encountered some difficulties in resolving an issue. I'm using documents and I need to select text in my document and place it inside a table. This table has only one row and two columns. The selected text must be in the second cell of the line and later, I need to delete the selected text and leave only the table with the text. The part of selecting the text to place it on a table, I can already do it, now I'm finding it difficult to work with the table layout, specifically in what is related to the part of the table's borders. See the image below.

My table needs only to have the central border visible and in red, the other borders must be hidden. I did not find in the documents of the documents, nothing related to the manipulation of borders individually, but only in general for the entire table. The code below does a lot of the work, but the edge in the style I want, not yet.

function myFunction() {
  var doc = DocumentApp.getActiveDocument();
  var body = doc.getBody();
  var selection = doc.getSelection();
  var ui = DocumentApp.getUi();
  var text = body.editAsText();
  var report = "";
  //----------------------------------------------------------------------------------------------------------\\
  
  if (!selection) {
    report += " Nenhuma seleção atual ";
    ui.alert( report );
  }
  else{
    var elements = selection.getSelectedElements();
    var element = elements[0].getElement();
    var selectedText = element.asText().getText();
    
    var styleCell1 = {};
    styleCell1[DocumentApp.Attribute.FONT_SIZE] = 20;
    styleCell1[DocumentApp.Attribute.HORIZONTAL_ALIGNMENT] = DocumentApp.HorizontalAlignment.CENTER;
    styleCell1[DocumentApp.Attribute.FOREGROUND_COLOR]='#888888';
    styleCell1[DocumentApp.Attribute.FONT_FAMILY]='Roboto';
    
    var styleCell = {};
    styleCell[DocumentApp.Attribute.FONT_SIZE] = 18;
    styleCell1[DocumentApp.Attribute.FOREGROUND_COLOR]='#000000';
    styleCell[DocumentApp.Attribute.HEADING] = DocumentApp.ParagraphHeading.HEADING1;
    styleCell[DocumentApp.Attribute.FONT_FAMILY]='Roboto';
    
    var cells = [
      ['', '']
    ];
    
    //body.insertParagraph(0, doc.getName()).setHeading(DocumentApp.ParagraphHeading.HEADING1);
    table = body.appendTable(cells);

    table.getRow(0).editAsText().setBold(true);
    table.getRow(0).getCell(1).setText(selectedText);
    table.getRow(0).getCell(1).setAttributes(styleCell);
    table.getRow(0).getCell(0).setWidth(59);
    table.getRow(0).getCell(0).setAttributes(styleCell1);
    table.setBorderColor('#ffffff');
    table.setBorderWidth(3);
  }
}

Answer 1

• You want to give the vertical border to only the center to the table which has the 1 row and 2 columns.
  • For example, the border style is 3 points in the width and the red color.
• You want to achieve this using Google Apps Script.

Issue and workaround:

Unfortunately, it seems that there are no methods for giving the border to only the center to the table using Document service. So in this answer, as a workaround, I would like to propose to use Google Docs API. When the batchUpdate method of Docs API, your goal can be achieved.

In this answer, after the table was inserted using your script, the start index of the inserted table is retrieved by the get method of Docs API, and then, the table cell style is modified by the batchUpdate method of Docs API.

Modified script:

When your script is modified, please modify as follows. Before you run the script, please enable Google Docs API at Advanced Google services.

From:

table.setBorderWidth(3);

To:

const index = body.getChildIndex(table);
const documentId = doc.getId();
doc.saveAndClose();
const tableStart = Docs.Documents.get(documentId).body.content[index + 1].startIndex;
const tempStyle = {width: {magnitude :0, unit: "PT"}, dashStyle: "SOLID", color: {color: {rgbColor: {blue: 0}}}};
const resource = {requests: [
  {updateTableCellStyle: {
    tableStartLocation: {index: tableStart},
    tableCellStyle: {borderTop: tempStyle, borderBottom: tempStyle, borderLeft: tempStyle, borderRight: tempStyle},
    fields: "borderTop,borderBottom,borderLeft,borderRight"
  }},
  {updateTableCellStyle: {
    tableRange: {
      tableCellLocation: {tableStartLocation: {index: tableStart}, rowIndex: 0, columnIndex: 0}, rowSpan: 1, columnSpan: 1},
      tableCellStyle: {
        borderRight: {dashStyle: "SOLID", width: {magnitude: 3, unit: "PT"}, color: {color: {rgbColor: {red: 1}}}}
      },
      fields: "borderRight"
  }}
]};
Docs.Documents.batchUpdate(resource, documentId);

References:

• Advanced Google services
• Method: documents.get
• Method: documents.batchUpdate
• UpdateTableCellStyleRequest