From dcaf125d8a87db04a5f9009e81c6beb6caec240b Mon Sep 17 00:00:00 2001
From: Piero Toffanin <pt@masseranolabs.com>
Date: Sat, 12 Jun 2021 11:28:35 -0400
Subject: [PATCH] Set selected attributes

---
 app/templates/index.html | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/app/templates/index.html b/app/templates/index.html
index 480640a..1b0140f 100644
--- a/app/templates/index.html
+++ b/app/templates/index.html
@@ -120,7 +120,7 @@
 							<div class="col s6 language-select">
 								<a href="javascript:void(0)" @click="swapLangs" class="btn-switch-language">
 									<i class="material-icons">swap_horiz</i>
-								</a>								
+								</a>
 								<span>Translate into</span>
 								<select  class="browser-default" v-model="targetLang" ref="targetLangDropdown" @change="handleInput">
 									<template v-for="option in langs">
@@ -335,7 +335,19 @@
 				if (this.charactersLimit !== -1 && this.inputText.length >= this.charactersLimit){
 					this.inputText = this.inputText.substring(0, this.charactersLimit);
 				}
-
+				
+				// Update "selected" attribute (to overcome a vue.js limitation)
+				// but properly display checkmarks on supported browsers
+				for (var i = 0; i < this.$refs.sourceLangDropdown.children.length; i++){
+					var el = this.$refs.sourceLangDropdown.children[i];
+					if (el.value === this.sourceLang) el.setAttribute('selected', '');
+					else el.removeAttribute('selected');
+				}
+				for (var i = 0; i < this.$refs.targetLangDropdown.children.length; i++){
+					var el = this.$refs.targetLangDropdown.children[i];
+					if (el.value === this.targetLang) el.setAttribute('selected', '');
+					else el.removeAttribute('selected');
+				}
 		},
 		computed: {
 			requestCode: function(){